PDA

Archiv verlassen und diese Seite im Standarddesign anzeigen : CSS Fragen


Gangstaslida
2005-01-19, 01:13:33
So, hab jetzt neu mit CSS angefangen und ein paar Tuts durchgeackert.
2 Sachen sind noch immer ungeklärt.

Mit a.hover wechselt ein Textlink beim darüberfahren seine formatierung. Ist das auch mit einem Bildlink möglich? Ich meine, dass beim hovern eie andere Grafik geladen wird. Bis jetzt musste ich das immer mit Java Script realisieren.

Wenn man auf dieser Page (http://homepage.sunrise.ch/mysunrise/eluskio/hp-blau.jpg) auf einen Link links klickt, ist es möglich, dass im leeren Feld ein neues html geladen wird? Oder muss man das mit Frames lösen?

thx Eluskio

ravage
2005-01-19, 02:31:03
1. Ja, ein anderes Bild per a:hover ist möglich. Aber nur dann, wenn du die Bilder als background-image einfügst. Das könntest du dann für jeden Link im Menü einzeln machen, oder du änderst wirklich nur den Hintergrund des Links und schreibst den Text vom Link einfach drüber... ok irgendwie doof ausgedrückt, ist schon spät...

Deine bla.css datei:

a.menu {
background-image:url(./images/link.jpg);
}

a.menu:hover {
background-image:url(./images/link_hover.jpg);
}


In deiner html datei:

<a class="menu" href="#">Link 1</a>
<a class="menu" href="#">Link 2</a>
<a class="menu" href="#">Link 3</a>
<a class="menu" href="#">Link 4</a>


2. Entweder machst du das mit iframes oder mit einem PHP include. Google einfach mal oder guck hier ins Forum. Darüber gibts es haufenweise Threads.

Gangstaslida
2005-01-19, 04:04:17
Super, hat alles geklappt :uup:

Leider werden die background images nur gerade über dem text angezeigt. d.h. wenn man die fontsize auf 0px stellt, ist alles weiss. Ich habe den text ja selbst auf die Buttons gepinselt...
Dann hilft wohl nur Javascript :rolleyes:

Binaermensch
2005-01-19, 16:03:09
<a class="menue" href=""><img class="1" src="" /><img class="2" src="" /></a>a.menue img.2 {display: none;}
a.menue:hover img.1 {display: none;}so oder so ähnlich geht das...

edit: http://www.meyerweb.com/eric/css/edge/popups/demo2.html