CSS plaatje links werkt niet in firefox - Softwareontwikkeling

woensdag 26 april 2006 12:31

Acties:

Topicstarter

Ik zal eerst mijn probleem uit leggen en daarna stukje code weer geven.

Mijn idee was om een plaatje als link te zetten plaats van tekst en als je met je muis er over gaan wordt het een gif plaatje met een beweging.
Dit idee heb ik met css uit gewerkt alleen in firefox laat hij geen plaatjes zien in IE weer wel.
Zowel de jpg ( geen muis er over) als de gif ( mouse-over) laat firefox niet zien.

Map indeling:

Hoofdmap -> staan php files in en paar mappen zoals CSS en images
CSS map -> Deze staat in hoofdmap met de css bestanden.
Image map -> staat in de hoofdmap met allemaal plaatjes.

pagina waar link plaatjes in staan

code:

<div id="menu">
    <div class="navgeb">
        <a href="'.$_SERVER['PHP_SELF'].'?p=cms&func=gebr">
            <div class="navgeb"></div>
        </a>
    </div>
</div>

css code

code:

.navgeb{
    width: 50px;
    height: 50px;
}
.navgeb a:link{
    width: 50px;
    height: 50px;
    background-image: url(../images/navigatie.jpg);
}
.navgeb a:visited{
    width: 50px;
    height: 50px;
    background-image: url(../images/navigatie.jpg); 
}
.navgeb a:hover{
    width: 50px;
    height: 50px;
    background-image: url(../images/navigatie.gif);
    cursor: pointer;
}
.navgeb a:active{
    background-image: url(../images/navigatie.jpg);
    width: 50px;
    height: 50px;
}

Omdat de plaatjes in andere folder staan moet ik ../ doen
De plaatjes zijn 50px bij 50px.

[ Voor 8% gewijzigd door vitrix op 26-04-2006 12:33 ]

woensdag 26 april 2006 12:32

Acties:

BasieP

lol, je weet dat een <div> geen plaatje is he?
maak er een <img> van en het werkt.

even voor de duidelijkheid: je kan niet overal maar <a> omheen gaan zetten.

ik zie het al gebeuren dat mensen zoiets verzinnen:

HTML:

<a>
  <body>
  </body>
</a>

[ Voor 101% gewijzigd door BasieP op 26-04-2006 12:33 ]

This message was sent on 100% recyclable electrons.

woensdag 26 april 2006 12:33

Acties:

vitrix

Topicstarter

jah ik zeg ook als achtergrond wil ik hem hebben.
die binnenste div is alleen maar om de binnenkant op te vullen.
Anders denk de div ik heb geen hoogte of breedte dus ik ben 0 en zie je niets.

Anders werkte het ook niet in ie en daar werkt het perfect

[ Voor 69% gewijzigd door vitrix op 26-04-2006 12:34 ]

woensdag 26 april 2006 12:34

Acties:

BasieP

vitrix schreef op woensdag 26 april 2006 @ 12:33:
jah ik zeg ook als achtergrond wil ik hem hebben.

dan nog kan je geen div in een achor zetten..

This message was sent on 100% recyclable electrons.

woensdag 26 april 2006 12:34

Acties:

JHS

Splitting the thaum.

Zoals * BasieP al een soort van aangeeft is a een inline element, en je mag daar niet zomeer een blocklevel element zoals een division inzetten

. Het is dan ook veel handiger om de anchor display: block; mee te geven, en het achtergrondplaatje daaraan vast te hangen.

DM!

woensdag 26 april 2006 12:34

Acties:

whoami

Dergelijke shizzle (CSS, JS, HTML) horen niet thuis in PRG , maar in W&G

>W&G

https://fgheysels.github.io/

woensdag 26 april 2006 12:35

Acties:

Grijze Vos

Ik gok dat FF het niet slikt omdat DIV een block element is en je die in een in-line element (A) gooit in je HTML.

Op zoek naar een nieuwe collega, .NET webdev, voornamelijk productontwikkeling. DM voor meer info

woensdag 26 april 2006 12:40

Acties:

vitrix

Topicstarter

Oki weer wat geleerd

tnx guy's met block werkt het idd.

Sorry voor fout plaatsen van topic had ff verkeerd gekeken.