Kommentare zu: CSS Bildwechsel - Web-Spirit.de

Coeliel schreibt:

Coeliel — Mon, 22 Mar 2010 23:08:39 +0100

hah es geht ;)

Coeliel schreibt:

Coeliel — Mon, 22 Mar 2010 23:05:37 +0100

ich hab das ganze auch einmal gemacht und es ging ohne probleme, ich hab aber 3 buttons bei denen das funktionieren soll. also hab ich denen unterschiedliche ids gegeben und das einfach im css angepasst.

mein html text

a#obertshausen{

display:block;
width:341px;
height:590px;
background: transparent url(bilder/button2_1.jpg) 0px 0px no-repeat;
text-indent:-9000%;

}

a:hover#obertshausen{

background: transparent url(bilder/button2_2.jpg) 0px -16px no-repeat;

}

a#10Jahre{

display:block;
width:341px;
height:590px;
background: transparent url(bilder/button3_1.jpg) 0px 0px no-repeat;
text-indent:-9000%;

}

a:hover#10Jahre{

background: transparent url(bilder/button3_2.jpg) 0px -16px no-repeat;

}

a#3Jahre{

display:block;
width:341px;
height:590px;
background: transparent url(bilder/button1_1.jpg) 0px 0px no-repeat;
text-indent:-9000%;

}

a:hover#3Jahre{

background: transparent url(bilder/button1_2.jpg) 0px -16px no-repeat;

}

und mein css.

bei der id obertshausen geht es, bei den anderen beiden nicht >_< und ich weiß nicht warum. wäre nett wenn mir da jemand helfen könnte.

Sebastian schreibt:

Sebastian — Fri, 22 Jan 2010 09:11:46 +0100

@Madman-Maniac: Wie bereits ober geschrieben, kannst du in den Link auch einen Text packen, sodass die Validität wieder gegeben ist. Dann einfach den Text mit einem negativen Texteinzug versehen. Ich habe es oben im Code mal angepasst.

Madman-Maniac schreibt:

Madman-Maniac — Thu, 21 Jan 2010 21:58:12 +0100

Nachtrag:
*argh* ohne img-Tag hilft das alt-Attribut nicht viel. Es ließe sich aber auch ein Blindpixel mit alt-Attribut einbauen. Aber das title-Attribut wäre möglich, oder?
Ich bezweifle auch gerade die Validität leerer Links. Von daher ist Sebastians Vorschlag doch die beste Lösung.
Tut einfach so, als hätte ich dazu nix geschrieben :P

Madman-Maniac schreibt:

Madman-Maniac — Thu, 21 Jan 2010 21:51:27 +0100

Absolut genial. Großes Lob!

@Andrea: Reicht dazu nicht wie bei anderen Bildern auch der Alternativ-Text aus dem alt-Attribut?

@Alexa: Du solltest evtl. einen anderen Editor versuchen ;) Notepad++ oder Weaverslave wären da zu empfehlen. Oder ganz profan den Windoof-Editor nehmen. Wenn das nicht klappt, probier's vorsorglich mal mit einem anderen Browser. Schlägt auch das fehl, liegt der Fehler wohl im Quelltext versteckt.

Sebastian schreibt:

Sebastian — Wed, 06 Jan 2010 00:35:11 +0100

Hallo Andrea,

du kannst gerne Text verwenden und diesen mit einem negativen Texteinzug visuell verschwinden lassen:

text-indent:-9000%;

Alexa Frankfurt schreibt:

Alexa Frankfurt — Mon, 04 Jan 2010 01:49:06 +0100

Hm, ist ja fein, Wenn ich aber mit einem der gängigen Editoren arbeite klappt das bei mir nicht !?

andrea schreibt:

andrea — Sun, 03 Jan 2010 14:03:47 +0100

Vielen Dank für diese Idee!
Es funktioniert super - aber ich frage mich - wg der Barrierefreiheit:
Wohin mit dem Text?
Ich hab´s mir jetzt lange angeschaut ... bisher dazu aber keine Lösung gefunden.
Ich hoffe, es ist nicht unhöflich! Aber ich komme einfach nicht selbst drauf ^^
Ich würde mich jedenfalls sehr (!) über weiterführende Hilfe freuen. :-)

sLG andrea

Norixz schreibt:

Norixz — Thu, 03 Dec 2009 17:21:25 +0100

Mensch...man lernt ja nie aus...
Herzlichen Dank für diese Info!

pArken schreibt:

pArken — Sun, 11 Oct 2009 23:26:54 +0200

Super Tipp! Werde ich gleich mal umsetzen. Dürfte eigentlich auch flotter funktionieren als ne Javascript Lösung, da ja bei beiden die vollen Grafiken erst vorgelanden werden, ich mir dann aber hier das Script erspare.

Carabon schreibt:

Carabon — Sat, 25 Apr 2009 17:31:01 +0200

Ahhh genau, ich wusste doch wie es geht. Vielen Dank ;D