Klik foto

[willem008]

Goede dag

Ik heb wat foto's op mij site toegevoegd.

Ik wil daar een link van maken dus als er op klik dat hij naar de pagina gaat, dat is op zich geen probleem
maar als ik <href="hier de link pagina"<src ="foto.jpg"></a> werkt dat goed

alleen in heb ook een menu in deze pagina staan en nu gaat hij die style gebruiken voor bijv de hover.

maar ik wil er geen style aan geven , hoe doe ik dan nu het gemakkelijks

http://service-netwerk.com

 

[jarco]

Hoi,

Kan je specifieker beschrijven wat er misgaat en waar dat juist misgaat?
Ik kijk op je site maar op de frontpage zijn je images niet klikbaar (behalve die ene boenaan). Op de andere pagina's zie ik niet direct een probleem.

De juiste manier om afbeeldingen klikbaar te maken is trouwens: <a href="linknaarpagina"><img src="link naar afbeeldingf" /></a>

 

[willem008]

Hoi,

Kan je specifieker beschrijven wat er misgaat en waar dat juist misgaat?
Ik kijk op je site maar op de frontpage zijn je images niet klikbaar (behalve die ene boenaan). Op de andere pagina's zie ik niet direct een probleem.

De juiste manier om afbeeldingen klikbaar te maken is trouwens: <a href="linknaarpagina"><img src="link naar afbeeldingf" /></a>

 

[C0mpN3rd]

De tags welke je gaf hebben niets te doen met de opmaak van een pagina. Waarschijnlijk doe je dus ergens anders iets fout.

Opmaak dient doormiddel van CSS plaats te vinden.

Een stukje source code zou handig zijn want ik kan het op jouw pagina nergens terug vinden.

 

[willem008]

Dat klopt ik heb ze weggehaalt
Maar ik bedoel als ik ze maak met <href ="pagina"> <scr ="foto"></a>
werk het goed maar ik krijg een rand om mij foto ,doordat hij de style van mijn menu overneemt
En dat wil ik niet.

 

[C0mpN3rd]

Zet dit in je CSS (verwijderd de rand rond alle afbeeldingen)

img {
border-style:none;}

Of maak een class indien je wel een border om andere afbeeldingen wil hebben.

.geenRand{
border-style:none;}

In het tweede geval veranderd ook de (X)HTML:

<a href="betreffendeLink"><img src="linkNaarAfbeelding" class="geenRand"></a>

Er zijn nog meer mogelijkheden maar optie 1 heeft de voorkeur. Optie twee zou alleen incidenteel mogen. Het is beter dan de betreffende tags direct aan te spreken of in een 'div' te plaatsen.

 

[willem008]

Sorry lukt me even niet

Heb het met een class geprobeerd maar hij bijft die navigatie style overnemen
Ik heb even een testje gemaakt , zoals je ziet krijg ik een zwarte rand naast de foto en als je er muis overgaat wordt die geel.
geel zit in de style van mijn menu


http://service-netwerk.com/test/index.php

 

[willem008]

Ben er achter waar de fout zit

Ik heb nu

http://service-netwerk.com

Bij google chrome en opera gaat het goed, alleen bij internet exploder krijg ik randen.


Hoe kan ik dat het simpelste oplossen.

 

[C0mpN3rd]

Probeer dit eens te veranderen in het bestand style2.css op regel 26.

#aanbieding {
color:#14285F;
font-family: Arial, Helvetica, sans-serif;}

Naar:

#aanbieding {
color:#14285F;
font-family: Arial, Helvetica, sans-serif;
border-style:none;}

 

[willem008]

Nee werkt ook niet , maar het is eigelijk geen rand het is de eigeschappen van het menu wat meewerkt

Namelijk

hover {background-color: #000; color:#000; text-decoration:none;
}
a:link {color:#000; text-decoration:none;
}
a:visited {color:#000; text-decoration:none;
}
a:hover {color:#ffff00; text-decoration:none;
}
a:active {color:#000; text-decoration:none;

Maar hoe kan ik nu het beste er voor zorgen dat dit niet actief is op die 4 foto's maar alleen op het menu

 

[C0mpN3rd]

Volgens mij hebben we het over iets verschillends als dit niet werkt.

In ieder geval je kunt met firebug (add-on) in firefox bekijken welk deel van de CSS aanspraak maakt op dat element.

 

[willem008]

Zo ziet hij erbij mijn in internet expl eruit ,niet goed



linkse foto is met muis erover

 

[C0mpN3rd]

#aanbieding a:link {border-style:none;}
#aanbieding a:visited {border-style:none;}
#aanbieding a:hover {border-style:none;}
#aanbieding a:active {border-style:none;}

 

[willem008]

Dat heb ik nu ook geprobeert maar blijft nog steeds die style van het menu gebruiken

de style van het menu staat zo in mijn stylesheet, zou daar soms iets fout zitten,
en ik begrijp ook nog steeds niet waarom opera, google chome en FF het wel goed weergeven.

ul.navbar {
background:#fff;
padding: 0 0 0 0;
height: 390px;
width: 130px;
border-right: 1px solid #fff;
list-style-type: none;
margin-left: 3px
margin-top:0px
}
li:hover {background-color: #000; color:#000; text-decoration:none;
}
a:link {color:#000; text-decoration:none;
}
a:visited {color:#000; text-decoration:none;
}
a:hover {color:#ffff00; text-decoration:none;
}
a:active {color:#000; text-decoration:none;
}

 

[csshunter]

Hoi Willem,
Als ik nu in Internet Explorer 7 de homepage en de aanbiedingen-pagina bekijk, zijn er helemaal geen borders te zien rond de afbeeldingen, ook niet bij hover (net als in de andere browsers). Volgens Netrenderer.com gaat het ook goed in IE8, IE9 en IE10.

Het lijkt dus opgelost!

• Als je ze in IE nog steeds met randen ziet, dan gebruikt IE misschien een opgeslagen oude versie. Wat gebeurt er als je de Tijdelijke Internet Bestanden opruimt? (menu Extra > Internetopties > Browsegeschiedenis > Verwijderen... > Tijdelijke Internetbestanden > Bestanden verwijderen)

Met vriendelijke groet,
CSShunter

 

[willem008]

Nee css hunter ik had alles weer even verwijdert want het ziet er niet uit.

Ik heb nu weer even van de linkse foto een link gemaakt , dus met <a href="hier doel"><src ="foto.jpg"></a>

maar zoals je zal zien gaat het alleen in internet expl fout , in opera, google chorme en FF gaat het wel goed.

Ben hier nu al ongeveer 3 dagen mee bezig maar lukt nog niet echt,
en zoals je me denk wel ken ik wil begrijpen waar de fout zit

http://service-netwerk.com

 

[csshunter]

Aha, ik zie 'm nu. Maar het is geen fout van jou, het is een fout van Internet Explorer!

• Rond images die in een link staan voegt Internet Explorer altijd zonder te vragen de kleur van een link toe als 2px brede border; en de hoverkleur van de link bij hoveren.

Door een eventuele border van een link zelf weg te halen met a {border: 0;} is dat niet op te lossen.
En ook niet door een simpele img {border: 0;}.

Het is alleen op te lossen door speciaal alle images binnen een link te verbieden een border te tonen, d.w.z. met de combinatie:

...
a img {
    border: 0;
    }

Als je dat toevoegt aan je style2.css, zou je er van af moeten zijn.

Met vriendelijke groet,
CSShunter

 

[willem008]

ok het is gelukt daar kom je als je het niet weet niet snel achter..

en ja hoor weer die internet exploder, maar ja we moeten er mee leven.
in ieder geval bedankt hij werkt nu goed.

dank