|
|||
![]()
Hallo und guten Tag euch allen,
ich habe mir mithilfe der schönen neuen CSS3-Funktionen einen Würfel zusammengebaut welcher quasi als Navigator funktioniert. Nun lässt er sich momentan allerdings hauptsächlich nur mit einem JS steuern (dies ist gewollt weil ich persönlich die Steuerung eines Würfels mit der Tastatur sehr nett finde). Da ich aber auch Besuchern die JS ausgeschalten haben den Cubus nicht vorenthalten möchte muss also noch eine zweite Steuerungsmöglichkeit hin. Mein Grundgedanke war also das ich unten eine einfache Menüleiste noch anbringe mit den Hauptpunkten der 6 Würfelseiten und wenn man über diese geht der Würfel sich dann auf diese Position dreht. Der hässliche Hacken an der ganzen Sache ist das so schön CSS auch sein mag, dessen Klassen oder ID's sind ja leider nicht Fähig weiter als bis zu Ihrem Nachbarelement zu Kommunizieren. HTML-Code:
<body> <div id="Cubus"> <!-- ID[Cubus] ist dafür zuständig das sich alles zusammen dreht--> <div class="Seite 1"> Würfelseite 1 </div> <div class="Seite 2"> Würfelseite 2 </div> <div class="Seite 3"> Würfelseite 3 </div> <div class="Seite 4"> Würfelseite 4 </div> <div class="Seite 5"> Würfelseite 5 </div> <div class="Seite 6"> Würfelseite 6 </div> </div> <div class="Würfelseite1link">//Link</Div> <div class="Würfelseite2link">//Link</Div> <div class="Würfelseite3link">//Link</Div> <div class="Würfelseite4link">//Link</Div> <div class="Würfelseite5link">//Link</Div> <div class="Würfelseite6link">//Link</Div> </body> Wird über einem Würfelseiten#link Divblock gehovert, so soll sich der Würfel entsprechend auf die Würfelseite drehen. Problem: Würfelseite1link macht das ganze noch genau so wie angedacht weil er als Nachbar des Cubus in CSS diesen ansprechen kann. Ab Würfelseite2link wird dies allerdings schwierig denn hier ist kein Nachbar bezug mehr vorhanden und CSS stößt an seine Grenzen. Hat jemand einen Vorschlag wie man das Ordentlich umgehen kann? Vielleicht gibt es ja auch einen total logischen Trick nur fällt er mir nicht ein ^^ Ich hoffe Ihr könnt mir helfen ich wäre euch super Dankbar. Vielen Dank im Voraus. MfG Lukas ![]() Geändert von Flummi1212 (21.08.2014 um 16:12 Uhr) Grund: Sieht verständlicher aus |
Sponsored Links |
|
|||
![]()
Trotz deiner Beschreibungen hab ich keinen Plan was du eigentlich machen willst. Deshalb auch in diesem Thread: Gibt es einen Live-Link, wo man sich das ansehen kann? Und HTML ohne das dazugehörige CSS ist nicht hilfreich. (gilt für den umgekehrten Fall auch)
|
Sponsored Links |
|
|||
![]()
Bei dem Beispiel unten im Link ist es so das der Divblock Würfelseite6 das Nachbarelement vom Cubus ist. Die Problematik aber ist dennoch natürlich die gleiche. Die Divblöcke Würfelseite1-5 können bei einem Hover nicht den Würfel zum drehen bringen weil hierfür die Reichweite von CSS nicht ausreicht, da der Würfel kein Nachbarobjekt mehr ist.
Das Beispiel Das einzige was ich bewirken möchte ist das die Rotationswerte X und Y geändert werden mit einem Mouseover sodass der Würfel sich dreht. MfG Lukas Geändert von Flummi1212 (22.08.2014 um 12:43 Uhr) |
![]() |
Stichwörter |
css3, nachbarelemente, reichweite, würfel |
Themen-Optionen | |
Ansicht | |
|
|
![]() |
||||
Thema | Autor | Forum | Antworten | Letzter Beitrag |
preg_replace treibt mich in den Wahnsinn | olik | Serveradministration und serverseitige Scripte | 14 | 30.03.2009 15:30 |
DIV bis GANZ unten | burnZ | CSS | 5 | 27.07.2008 14:14 |
Header - Leftmenue, Kontent 100% - footer CSS und keine Scrollbars! | Mavarik | CSS | 8 | 26.07.2008 18:11 |