css rollovers

[Jerry]

har ett litet problem, gjort en sida på myspace åt tjejen, och den ser inte bra ut i ie, vilket e förståeligt. Jag har gjort ett par rollovers, två stycken som är genomskiliga förutom den ena som har en vit kant. Det är för en meny med ett par kategorier. Det som gör mig förbryllad är att dom två sista i raden syns men inte dom andra, fast dom använder sig av samma rollover... ??

 

Sen funkar inte genomskilighet alls i IE?

[_Michael_]

Hur gör du tranparansen?

 

med PNG-bilder eller med Opacity i CSS?

[OzzieWild]

Har du lust att posta den aktuella koden? Vore lite hjälpsammare

[Jerry]

Hur gör du tranparansen?

 

med PNG-bilder eller med Opacity i CSS?

 

Med PNG-bilder (kan inget om css egentligen.. )

[Jerry]

Har du lust att posta den aktuella koden? Vore lite hjälpsammare

 

här är koden jag kör nu!

 

<a href=""class="add"></a>

<div class="header2"></div>

 

<style type="text/css">

.header2{

background:url(http://www.fileden.com/files/2006/8/17/172266/clearrolloverunder.png) top left no-repeat;

display:block;width:211px;height:27px;

position:absolute;left:53px;top:152px;

z-index:0;

}

</style>

 

<style type="text/css">

a.add{

position:absolute;top:152px;left:53px;

display:block;overflow:hidden;

width:211px;height:27px;

background-color:transparent;

z-index:4;

visibility:visible;display:inline;

}

a.add:hover{

background:url(http://www.fileden.com/files/2006/8/17/172266/clearrolloverover.png) top left no-repeat;

z-index:4;

visibility:visible;display:inline;

}

</style>

[Jerry]

sen en fråga, om jag vill ha en rollover med TVÅ bilder, som är separerade från varandra, dvs när jag rör musen över en bild så dyker det upp en annan på sidan av, nån som har koll på det?

[OzzieWild]

Hmm. PNG-filer stöds inte av IE6, och istället för att transparent som bakgrundsfärg på din a tagg, skriv istället ingenting. Den är transparent by default.

[OzzieWild]

sen en fråga, om jag vill ha en rollover med TVÅ bilder, som är separerade från varandra, dvs när jag rör musen över en bild så dyker det upp en annan på sidan av, nån som har koll på det?

Antingen får du göra stora bilder, så det ser ut som att den ligger vid sidan av, eller så får du använda dig av div'ar (lager) och javascript. Vet dock inte om det går att använda javascript på MySpace?

[Jerry]

Hmm. PNG-filer stöds inte av IE6, och istället för att transparent som bakgrundsfärg på din a tagg, skriv istället ingenting. Den är transparent by default.

 

Okey ska ändra! skumt att dom två understa visas då? Och man kanske ska ändra till nåt annat än PNG då.. typ tiff elelr nåt?

[Jerry]

Antingen får du göra stora bilder, så det ser ut som att den ligger vid sidan av, eller så får du använda dig av div'ar (lager) och javascript. Vet dock inte om det går att använda javascript på MySpace?

 

nope, javascript är inte tillåtet.. Men jag trodde det fanns css för att använda två bilder för rollovers? eller jag kanske är helt fel ute..

[_Michael_]

tiff har inte stöd för transparans.

gif har stöd för transparans men saknar en alpha-kanal vilket betyder att du inte kan ha någon typ av "semi-transparans".

 

Antar att PNG ändå är det bäste valet för dig eftersom du använder en font som ej är standard i webbläsarna. För att lösa problemet med att IE inte kan tolka PNG så finns det ett litet skript som du kan ladda ner för att lösa det, om du söker på ex. Google efter "IE PNG FIX" så lär du hitta massor med svar, har dock själv ingen erfarenhet av dessa men det jag hört är att dom ska funka.

 

Ett annat sätt kan vara att med php generera en heltransparant gif-bild med texten på och sen lägga en semi-transparant bakgrund under den, kom då ihåg att webbläsarna har olika css för dessa.

[_Michael_]

sen en fråga, om jag vill ha en rollover med TVÅ bilder, som är separerade från varandra, dvs när jag rör musen över en bild så dyker det upp en annan på sidan av, nån som har koll på det?

 

Förstår inte helt vad det är du menar...?

[Jerry]

tiff har inte stöd för transparans.

gif har stöd för transparans men saknar en alpha-kanal vilket betyder att du inte kan ha någon typ av "semi-transparans".

 

Antar att PNG ändå är det bäste valet för dig eftersom du använder en font som ej är standard i webbläsarna. För att lösa problemet med att IE inte kan tolka PNG så finns det ett litet skript som du kan ladda ner för att lösa det, om du söker på ex. Google efter "IE PNG FIX" så lär du hitta massor med svar, har dock själv ingen erfarenhet av dessa men det jag hört är att dom ska funka.

 

Ett annat sätt kan vara att med php generera en heltransparant gif-bild med texten på och sen lägga en semi-transparant bakgrund under den, kom då ihåg att webbläsarna har olika css för dessa.

 

ah sorry menade Gif. Dock verkar ju PNG som sagt vara ett bättre alternativ, förhoppningsvis så kör dom flesta IE7 istället.

 

Ska kolla upp PNG fixen!

[Jerry]

Förstår inte helt vad det är du menar...?

 

Menar att som det är nu när jag gör rollovers, så när jag rör musen över en bild, så dyker det upp en annan på exakt samma ställe. Skulle vilja röra med musen över en bild på sidan, så att det dyker upp en rollover på en annan del av sidan.

[tjorven]

tiff har stöd för transparens...men är därimot är det inte ett internet-format så det stöds inte i browsers. tiff är ett bra format att använda vid print tex.

 

png med transparens stöds i moderna browsers förutom explorer (innan version 7) som fortfarande inte lärt sig stödja de standarder som finns.

 

gif stöder transparens i en färg och fungerar i alla browsers.

[Jerry]

tiff har stöd för transparens...men är därimot är det inte ett internet-format så det stöds inte i browsers. tiff är ett bra format att använda vid print tex.

 

png med transparens stöds i moderna browsers förutom explorer (innan version 7) som fortfarande inte lärt sig stödja de standarder som finns.

 

gif stöder transparens i en färg och fungerar i alla browsers.

 

Hmm ok.. Detta är alltså ett problem som försvinner med IE6? Alltid nåt bra.. Får nog köra på med PNG tillsvidare. Och arbeta på att minska genomskilighet hehe..

[_Michael_]

gif stöder transparens i en färg och fungerar i alla browsers.

 

Som sagt, saknar alpha-kanal.

[Gabbeman]

Menar att som det är nu när jag gör rollovers, så när jag rör musen över en bild, så dyker det upp en annan på exakt samma ställe. Skulle vilja röra med musen över en bild på sidan, så att det dyker upp en rollover på en annan del av sidan.

Det du vill ha, gissar jag, heter Dual image flip och e faktiskt riktigt coolt. Använder det på min egen supportersajt faktiskt. Det är lite bök att sätta upp det, men när man väl fattat tänket så blir det riktigt bra.

 

Tutorial hittar du på HTMLgoodies. Lycka till och berätta om du fick det att funka!

[Jerry]

Det du vill ha, gissar jag, heter Dual image flip och e faktiskt riktigt coolt. Använder det på min egen supportersajt faktiskt. Det är lite bök att sätta upp det, men när man väl fattat tänket så blir det riktigt bra.

 

Tutorial hittar du på HTMLgoodies. Lycka till och berätta om du fick det att funka!

 

Det där är precis vad jag försöker göra! Dock UTAN javascript, vill få det att funka med Css.. Det ska vara på en myspacesida och javascript är inte tillåtet där..

[Gabbeman]

Det där är precis vad jag försöker göra! Dock UTAN javascript, vill få det att funka med Css.. Det ska vara på en myspacesida och javascript är inte tillåtet där..

Äsch, det hade jag ju fattat om jag bara läst igenom din fråga ordentligt. *slap on the fingers*

 

Jag är verkligen skitusel på programmering kan jag säga, men kolla in den här sidan och säg om du hittar svaret där. Hoppas!

[Jerry]

Äsch, det hade jag ju fattat om jag bara läst igenom din fråga ordentligt. *slap on the fingers*

 

Jag är verkligen skitusel på programmering kan jag säga, men kolla in den här sidan och säg om du hittar svaret där. Hoppas!

 

Tack kollade in sida, dock fick jag inget att funka. Men så är jag oxå rätt usel på programmering. Men efter en massa googlandes så får jag uppfattningen att det inte går att göra en dual image flip med css...

[Jerry]

Bump.. ingen som vet om det går att få till en dual image flip med css?

[Jerry]

Kan man inte typ placera en bild i en div, och göra den osynlig, för att sen göra den synlig vid mouseover över en länk nån annanstans på sidan?

[Zanathel]

1) Specifiera samtliga menylänkar som blockenheter

2) Applicera bakgrunden via background-image

3) Lägg till hover till länkarna i fråga där du specificerar den alternativa bilden via background-image.

 

Det är precis det du skall göra

[OzzieWild]

Kan man inte typ placera en bild i en div, och göra den osynlig, för att sen göra den synlig vid mouseover över en länk nån annanstans på sidan?

Jo då, men då krävs tyvärr JavaScript