1

onsdag, 29. november 2006, 10:42


Ja, er der en nem måde at lave links som vha. af css'en vises som billeder, men når den er slået fra, så ser man bare tekstlinks?

Eller er det overhovedet muligt?

Har nogle idéer til hvordan det kan laves, men det er squ lidt kringlet efter min mening.


2

onsdag, 29. november 2006, 11:07


Eneste jeg lige kan komme på er at lave billedet som baggrund på a {}

så vil det jo forsvinde når CSS slås fra, alle andre løsninger hvor billedet indsættes i HTML vil altid (så vidt jeg kan regne ud) resultere i at billedet vises når CSSen slås fra


3

onsdag, 29. november 2006, 11:15


Citeret

Originally posted by WebT
Eneste jeg lige kan komme på er at lave billedet som baggrund på a {}

så vil det jo forsvinde når CSS slås fra, alle andre løsninger hvor billedet indsættes i HTML vil altid (så vidt jeg kan regne ud) resultere i at billedet vises når CSSen slås fra


Ye, det er også sådanne ting jeg har haft i tankerne.

Problemet er måske bare det, at billedet er tekst i sig selv, hvilket jeg måske kunne have forklaret forstart.

Havde været rart, hvis stroke fandtes i CSS.

Outline kan nemlig ikke bruges til sådan noget, desværre.


4

onsdag, 29. november 2006, 12:15


Så bliver det besværligt men hvad med

<a href="link"><span class="noShow">Tekst link</span></a>

og så en display:none; på .noShow og å igen billedet på i a { }


5

onsdag, 29. november 2006, 12:42


Citeret

Originally posted by WebT
Så bliver det besværligt men hvad med

<a href="link"><span class="noShow">Tekst link</span></a>

og så en display:none; på .noShow og å igen billedet på i a { }


Det kan da lige prøves :D

ThankQ :cheers:


6

onsdag, 29. november 2006, 14:00


er kommet så langt som nedenfor. Billedet bliver kun vist, når CSS'en er slået til, men af en eller anden grund vil punktopstillingen ikke forblive "inline".

Jeg kan have overset et eller andet.

Kildekode

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
<ul class="ulnav">	
	<li style="display: inline; margin-right: 10px;" class="menulink1"><a href="" title=""><div class="menulink1"><span class="noShow">Foto</span></div></a></li>
	
	<li style="display: inline;"><img src="gfx/dot.gif" alt="" /></li>
	
	<li style="display: inline; margin-left: 10px; margin-right: 10px;"><a href="" title=""><div class="menulink1"><span class="noShow">Foto</span></div></a></li>
	
	<li style="display: inline;"><img src="gfx/dot.gif" alt="" /></li>
	
	<li style="display: inline; margin-left: 10px; margin-right: 10px;"><a href="" title=""><div class="menulink1"><span class="noShow">Foto</span></div></a></li>
	
	<li style="display: inline;"><img src="gfx/dot.gif" alt="" /></li>
	
	<li style="display: inline; margin-left: 10px;"><a href="" title=""><div class="menulink1"><span class="noShow">Foto</span></div></a></li>
</ul>


class="menupunkt1"

Kildekode

1
2
3
4
5
6
.menulink1 {
	background-image: url(gfx/knap1.gif);
	background-repeat: no-repeat;
	width: 47px;
	height: 15px;
}


7

onsdag, 29. november 2006, 15:09


Tror måske det skyldes DIV elementerne, tror da heller ikke det er helt gyldigt at smide et blok element ind i et <li>...


8

onsdag, 29. november 2006, 15:51


Citeret

Originally posted by WebT
Tror måske det skyldes DIV elementerne, tror da heller ikke det er helt gyldigt at smide et blok element ind i et <li>...


Ye, for det står "inline", når div-elementet ikke er der ..

Heller ikke fordi dette er livsens nødvendigt, men synes det ville være lidt smart :D


9

onsdag, 29. november 2006, 19:05


er div'en overhovedet nødvendig?


10

onsdag, 29. november 2006, 19:58


Citeret

Originally posted by WebT
er div'en overhovedet nødvendig?


Ved det ikke helt. Der kommer ikke noget billede, hvis man sætter den på linket. Det skyldes formodentlig, at der ikke er noget tekst eller et elementer.


11

onsdag, 29. november 2006, 20:25


kan tænkes der skal sættes en bredde på linket først


12

onsdag, 29. november 2006, 20:50


Citeret

Originally posted by WebT
kan tænkes der skal sættes en bredde på linket først


Ye, har været så langt som både højde og bredde :ph34r:

Måske det ikke er muligt uden at rode sig ud i noget php eller andet :(


13

torsdag, 30. november 2006, 14:26


Hmm hvad med float og en relativ positionering i stedet for inline

lige en hurtig test viser at det her virker:


HTML

Kildekode

1
2
3
4
5
<ul class="ulnav">	
	<li><a href="" title="">&nbsp;<span class="noShow">Foto</span></a></li>
	<li><a href="" title="">&nbsp;<span class="noShow">Foto</span></a></li>
	<li><a href="" title="">&nbsp;<span class="noShow">Foto</span></a></li>
</ul>

Læg mærke til &nbsp; uden noget indhold overhovedet vil den simpelthen ikke

CSS

Kildekode

1
2
3
4
5
6
7
8
9
10
11
12
13
14
.ulnav {
	list-style:none;
	margin:0;
	padding:0;
}
.noShow {
	display:none;
}
.ulnav li {
	width:100px;
	background:url(billede.gif) repeat-x;
	float:left;
	position:relative;
}


14

torsdag, 30. november 2006, 14:47


Ser spændende ud. Det vil jeg da med det samme få sat ind :)

Edit:

For satan da bobby, du er jo genial :clap:

Dette indlæg er blevet redigeret 1 gange, senest redigeret af "Macimuz" (30.11.2006, 14:53)


15

torsdag, 30. november 2006, 15:02


Citeret

Originally posted by Macimuz
Ser spændende ud. Det vil jeg da med det samme få sat ind :)

Edit:

For satan da bobby, du er jo genial :clap:


Var der nogensiden nogen tvivl? :clap:

Nej der skulle tænkes lidt ud af boksen der da, ikke hver dag man har brug for den slags, men trods alt godt at ha' i baghånden


16

torsdag, 30. november 2006, 15:06


Citeret

Originally posted by WebT

Citeret

Originally posted by Macimuz
Ser spændende ud. Det vil jeg da med det samme få sat ind :)

Edit:

For satan da bobby, du er jo genial :clap:


Var der nogensiden nogen tvivl? :clap:

Nej der skulle tænkes lidt ud af boksen der da, ikke hver dag man har brug for den slags, men trods alt godt at ha' i baghånden


hehe, så pudser vi lige glorien :T

Men ja, den var teknisk lidt speciel, må man sige.

Dog strækker linket sig kun over mellemrummet, men ellers virker det :D :clap: :dance: :hb: :cheers:


17

torsdag, 30. november 2006, 15:26


Det må kunne fikses med:
.ulnav li a {
width:100%;
display:block;
position:relative;

}


18

torsdag, 30. november 2006, 15:47


Citeret

Originally posted by WebT
Det må kunne fikses med:
.ulnav li a {
width:100%;
display:block;
position:relative;

}


Yessir :clap:


Nyeste Videoer og Trailers

Indsend nyhed
Har du fundet en fed nyhed så indsend den så alle andre på Tweak.dk kan få glæde af den.