hallo djheke,
das ist ja genau, das was ich mir zusammengeschraubt, und nicht zum laufen gebracht habe.
supergeil!!!!
danke polldaube
Beiträge von polldaube
-
-
Hallo synaptic,
hab gerade mit meinem chef geprochen und ihm gesagt, dass ohne javascript nix zu machen ist.
werd also jetzt das teil mit javascript aufbauen.
mit java (jquery) hab ich noch keine erfahrung- wie würde man sowas anfassen?
danke im vorraus
polldaube -
Hallo Leute,
habe jetzt mal zum Verständniss die Ursprungsdatei hochgeladen, welche ja nur unter Firefox funktioniert.
wie kann ich das CSS bearbeiten, damit der Krams überall läuft, ohne JS query zu benutzen?
Danke im Vorraus
http://web22206.server109.greatnet.de/test/test.htmlHTML
Alles anzeigen<html> <head> <title></title> </head> <body> laber laber laber laber laber laber laber laber laber laber laber laber laber laber laber laber laber laber laber laber laber laber laber laberlaber laber laber laber laber laber laber laber laber laber laber laberlaber laber laber laber laber laber laber laber laber laber laber laberlaber laber laber laber laber laber laber laber laber laber laber laberlaber laber laber laber laber laber laber laber laber laber laber laberlaber laber laber laber laber laber laber laber laber laber laber laberlaber laber laber laber laber laber laber laber laber laber laber laberlaber laber laber laber laber laber laber laber laber laber laber laberlaber laber laber laber laber laber laber laber laber laber laber laberlaber laber laber laber laber laber laber laber laber laber laber laberlaber laber laber laber laber laber laber laber laber laber laber laberlaber laber laber laber laber laber laber laber laber laber laber laber <style> .werwer ul { text-align: left; list-style-type: none; font-family: Arial; font-size: 10px; } .werwer ul li { float: left; margin: 0px; overflow: hidden; } .werwer ul li a { position: absolute; right: 0px; top: -100px; width: 600px; height: 305px; color: #fff; margin-bottom: 100px; border: 4px solid #cc0000; background: url(images/LS_Azubi.jpg) no-repeat right top ; font-size: 14px; text-decoration: none; text-align: left; padding-left: 0px; padding-top: 0px; display: block; margin-top: 100px; text-indent: 0px; } .werwer ul li a:focus .werwer ul li a:active { padding-top: 100px; margin-top: 100px; text-indent: -800px; } .werwer ul li a.link-4:focus { background: #cccccc; color: black; width: 30px; height: 200px; } .werwer ul li a span { display: block; margin-top: 10px; font-weight: normal; text-indent: 0px; position: relative; opacity: 0; } .werwer ul li a:focus span { opacity: 1; margin-top: 24px; -ms-transform: rotate(350deg); -webkit-transform: rotate(90deg); transform: rotate(90deg); font-size: 20px; } </style> <div class="werwer"> <ul> <li><a class="link-4" href="test.html"><span>Stellenangebote</span> </a></li> </ul> </div> </body> </html>
-
ganz einfach
weils normalerweise funktioniert, ich keine möglichkeit habe externe links einzusetzen oder in den head zu packen
der html bereich soll weg -später will ich das script alleine nutzen
Gruss
Polldaube- - - Aktualisiert - - -
Gastl
ja fast (hellbaue fläche die sich zusammenschrumft auf einen schmalen seitenbalken) siehe meinen link
gruß
polldau -
Hallo Leute,
ich habe da folgendes Problem.
hab in css einen Button aufgebaut der eine Info enthalten, und bei einem Mausclick an der seite verschwinden soll.
soweit so gut, aber unter den browsern IE, Safari 5.1 und Google Chrome reagiert der zusammengeschobene Button nicht und springt immer in die Ursprungsposition zurück. (unter Firefox macht er was er soll!)
welchen Befehl muss ich wo eingeben, dass auch die anderen browser bedient werden?
hoffe ich habe mich einigermassen verständlich ausgedrückt.
(Javascript kommt nicht in Frage- da der Button auch bei ausgeschaltetem Java und Javascript laufen soll)
hab mal ne testversion hochgeladen:
http://web22206.server109.greatnet.de/test/test.htmlHTML
Alles anzeigen<html lang="de"> <head> <meta charset="utf-8"> <title>Test</title> </head> <body> <style> .werwer ul { text-align: left; list-style-type: none; font-family: verdana; font-size: 10px; } .werwer ul li { float: right; margin: -8px; overflow: hidden; } .werwer ul li a { width: 600px; height: 300px; color: #fff; border-bottom: 0px; background: rgba(0,175,223,0.5); font-size: 14px; text-decoration: none; text-align: left; padding-left: 5px; padding-top: 10px; display: block; margin-top: 100px; text-indent: 40px; } .werwer ul li a:focus { padding-top: 110px; margin-top: 0px; text-indent: -100px; } .werwer ul li a.laupa:active { position: absolute; top: 20px; right: 0px; background: rgba(166,43,57,0.5); color: black; width: 40px; height: 150px; } .werwer ul li a span { display: block; margin-top: 100px; font-weight: normal; text-indent: 5px; position: relative; opacity: 0; } .werwer ul li a:focus span , .werwer ul li a:active span{ opacity: 1; margin-top: -0px; -ms-transform: rotate(350deg); -webkit-transform: rotate(90deg); transform: rotate(90deg); font-size: 15px; } </style> <div class="werwer"> <ul> <li><a class="laupa" href="#">test <span>Stellenangebote</span></a></li> </ul> </div> </body> </html>