Text "aufklappen" ohne JavaScript - Seite 2

toscho · #11 (**permalink**) 10.02.2005, 12:36

Zitat:

Zitat von ulle

Demnach wäre es nicht möglich innerhalb eines LINKs eine Textfolge durch [text-decoration] zu verändern.

Bingo! So ist es.
Es gab mal einen guten Artikel von Eric Meyer auf »Netscape Devedge« dazu, »Understanding Underlines«, leider hat er den selbst nicht gespiegelt, im Webarchiv ist er nicht und sonst finde ich ihn auch nirgendwo. Schade.

Was du tun kannst: Gib dem Kind des Elementes <a> explizit eine Hintergrundfarbe, die sich über die durchscheinende Unterstreichung legt (notfalls »line-height« anpassen). Sonst geht nichts.

Gruß
Thomas

ulle · #12 (**permalink**) 10.02.2005, 12:50

Das ist mir zu Tricky, aber umgekehrt definiert müßte es gehen:

Code:

a			{
			color: #000000;
			text-decoration: none;
			}
			
a strong	{
			text-decoration: underline;
			font-weight: normal;
			}

Code:

	

	
	block 1
	<a id="block1" href="#block1">aufklappen
		<span>rest vom text</span>
	</a>
	</p>

Okay - strong ist hier unglücklich, ginge auch mit Classes - geht ja nur ums Prinzip.

feelx · #13 (**permalink**) 10.02.2005, 13:05

@Ulle: Also diese Outlines habe ich defnitiv NICHT im IE5.5/6. ABER: Im gestern veröffentlichen AOL-Browser, der auf IE6 aufsetzt, habe ich die Dinger.. .da sieht's genau so aus, wie dein Screenshot. Im FF hab ich Outlines um den Link und im IE gar keine...

PS: Schau doch mal kurz deine PNs an

wahsaga · #14 (**permalink**) 10.02.2005, 13:12

Zitat:

Zitat von ulle

Zitat:

Du siehst ja auch die »text-decoration« vom Element <a>, nicht vom <span>. Die scheint durch, das muß auch so sein.

Wie meinst Du das?

ich erkläre das immer gern mit folgendem beispiel:

du hast einen pappkarton - dein <a>-element. dieser hat einen boden - text-decoration:underline.
jetzt stellst du in diesen karton einen eimer (<span>) hinein, dessen boden du entfernt hast - text-decoration:none

obwohl der eimer jetzt keinen boden mehr hat, kannst du wenn du von oben in ihn hineinblickst, trotzdem nicht den fussboden sehen - weil da noch der boden des kartons, in dem der eimer steht, dazwischen ist.

Zitat:

Demnach wäre es nicht möglich innerhalb eines LINKs eine Textfolge durch [text-decoration] zu verändern.

tja, in obige "richtung" nicht, in die "andere" natürlich schon - link mit text-decoration:none, span darin mit underline - das "funktioniert" natürlich so, wie man's erwartet.
analog zum beispiel: pappkarton ohne boden, eimer mit boden - jetzt ist der fussboden nur dort nicht sichtbar, wo der eimer steht, ringsherum im bereich des kartons aber schon.

ulle · #15 (**permalink**) 10.02.2005, 13:19

Zitat:

Zitat von feelx

Also diese Outlines habe ich defnitiv NICHT im IE5.5/6.

Welche Abhängigkeit hat der hohle IE mit den OUTLINEs, ich benutze mein WIN XP im klassischen Design, das wäre das einzige was ich mir noch vorstellen kann (!?)

feelx · #16 (**permalink**) 10.02.2005, 13:42

@Ulle: ich hab auch "Standard-look", also Win2000 Look in XP. Allerdings nur SP1... Könnte es evtl. noch daran liegen, dass ich keine Outlines habe?

ulle · #17 (**permalink**) 10.02.2005, 13:52

Zitat:

Allerdings nur SP1... Könnte es evtl. noch daran liegen, dass ich keine Outlines habe?

Keine Ahnung, aber [terrikay] hatte die OUTLINEs ja auch nicht, evtl. äußert sie sich nochmal.

Was ist mit den IDs/Skiplinks auf sich selbst, kann es nun der Opera?

Code:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="de" lang="de"> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" /> 
<title>xxxx</title> 

<style type="text/css" media="screen,projection" title="Druckvorschau-semantic-Test">
/*<![CDATA[*/ 

*			{ 
        	margin:  0; 
        	padding: 0; 
			} 

html, body 	{ 
			color:			  #000000; 
			background-color: #FF9922;
			line-height: 1.45;
			} 

body		{
			padding: 3em 1em;
			
			font-size:   100.01%;
			font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
			}
			
div			{
			border:  1px solid #000000;
			padding: 1em .5em;
			
			background-color: #FFFFFF;
			
			font-size: .8em;
			}

p			{
			margin: .5em 0 0;
			
			background-color: #EEEEEE;
			}

			
a			{
			color: #000000;
			text-decoration: none;
			}
			
a strong	{
			text-decoration: underline;
			font-weight: normal;
			}
			
a:focus,
a:active	{
			background-color: #99CCFF;
			}	

			
a span		{
			display: none;
			}

a:focus span,
a:active span
			{
			display: block;
			
			margin: 0;
			border:  0 none;
			padding: 1em;
			
			/*text-decoration: none;*/ /* funktioniert nicht im Opera */
			
			background-color: #99CCFF;
			}
			

					
/*]]>*/ 
</style> 

</head> 
<body>
 
<div>

	

	
	block 1
	<a id="block1" href="#block1">aufklappen

		<span>rest vom text</span>
	</a>
	</p>
	
	

	
	block 2
	<a id="block2" href="#block2">aufklappen

		<span>rest vom text 
 rest vom text</span>
	</a>
	</p>
	
	

	
	block 3
	<a id="block3" href="#block3">aufklappen

		<span>rest vom text</span>
	</a>
	</p>
	
	

	
	kein block
	<a href="#block1">aufklappen von block1
	</a>
	</p>
	
</div>

</body> 
</html>

mazzo · #18 (**permalink**) 10.02.2005, 14:27

in Opera klappt block1 nicht auf wenn man auf den untersten link geht. Im IE geht das. Aber outlines hab ich da immer noch nicht.

Wär aber endgeil wenn man das aufklappen in Opera auch stabilisieren könnte, ohne den Link zu markieren oder ähnliche Tricksereien.

ulle · #19 (**permalink**) 10.02.2005, 14:34

Geht denn das einfache Aufklappen (auf sich selbst) im Opera jetzt besser, bekannt ist ja das der Opera ein Focus-Problem hat (jetzt habe ich ärger mit Toscho)

mazzo · #20 (**permalink**) 10.02.2005, 14:38

nee, in Opera kollabiert der aufgeklappte Bereich immer noch sobald der link nicht mehr geklickt wird.

Themen-Optionen
Druckbare Version zeigen Jemanden per E-Mail auf dieses Thema hinweisen
Ansicht
Linear-Darstellung Zur Hybrid-Darstellung wechseln Zur Baum-Darstellung wechseln

Ähnliche Themen
Thema	Autor	Forum	Antworten	Letzter Beitrag
Div Float Clear usw... Ich dreh durch ;)	buggix	CSS	14	11.02.2010 09:42
Wrapper wächst nicht mit, keine Floats	maclady	CSS	11	10.02.2010 18:30
Parent DIV soll mit der Höhe seines Childs wachsen	Tekkla	CSS	2	19.11.2009 19:27
gibt es eine andere Lösung ohne Tabelle?	online	CSS	16	24.04.2009 09:41
Floats verschwinden im nichts, Fließer überdecken Floats.	nick	CSS	5	09.02.2008 15:34