Eigen website

foto op website vergroten

Gestart door marann op 10 dec 2018, 17:04 6 berichten 10.914 keer gelezen
marann Startte dit onderwerp 10 dec 2018, 17:04 Schoten 181 berichten
beste,
Hoe kan ik een foto die op mijn webpagina staat met een klik van muis vergroten op die pagina?
Alvast bedankt voor uw antwoord.
Met vriendelijke groeten
Marcel
Wie op zijn afkomst pocht, is als een aardappel: het beste deel zit onder de grond.
coderunner 10 dec 2018, 18:39 Aubauke - Aentwaerepe 1.828 berichten
Beste marann,

Kan je dat niet oplossen met "onmouseover" (om foto te vergroten) en "onclick" (voor de link)?

mvg,
Coderunner
Bedank de perso(o)n(en) die je volledig op vrijwillige basis een antwoord geeft(geven) en/of beantwoord ten minste een reaktie op jouw vraag. Zo weten andere gebruikers EN de moderator dat je "probleem" al dan niet is opgelost. Alvast bedankt.
maior domus 11 dec 2018, 15:17 1.628 berichten
Ik denk dat het vooral belangrijk is dat je een methode gebruikt waarbij je de foto maar één keer moet opladen naar je server (om ruimte te besparen).
Dus geen grote en een kleine versie, maar één versie die groter wordt getoond bij hooveren met de cursor.
Ondank is 's werelds loon
marann Startte dit onderwerp 11 dec 2018, 15:56 Schoten 181 berichten
Allen,
Dit is toch niet zo simpel dan ik dacht. Ik heb het volgende gedaan: ik maak een pagina aan voor de foto die ik wens te vergroten ( dit zijn maar enkele foto's ), klik op de foto en ga naar de bewuste pagina waar ik de afmetingen vergroot heb. Dit is simpeler.
Toch bedankt voor het mee denken.
Met vriendelijke groeten
Marcel
Wie op zijn afkomst pocht, is als een aardappel: het beste deel zit onder de grond.
Sony 11 dec 2018, 16:09 Boom 5.235 berichten
marann,

Code: Selecteer alles

<!DOCTYPE html>
<html>
<body>
<img onmouseover="bigImg(this)" onmouseout="normalImg(this)" border="0" src="smiley.gif" alt="Smiley" width="32" height="32">
<p>De functie bigImg() treed in werking als de muiscursor over de afbeelding gaat. 
Deze functie vergroot de afbeelding.</p>
<p>De functie normalImg() treed in weking als de cursor de afbeelding verlaat. 
Deze functie zet hoogte en breedte van de afbeelding terug normaal.</p>
<script>
function bigImg(x) {
    x.style.height = "128px";
    x.style.width = "128px";
}

function normalImg(x) {
    x.style.height = "32px";
    x.style.width = "32px";
}
</script>
</body>
</html>
Afbeelding

Dit is de smiley die bij het voorbeeld hoort.

Afbeelding

Sony
I Afbeelding SeniorenNet
marann Startte dit onderwerp 11 dec 2018, 16:37 Schoten 181 berichten
Sony bedankt. Dit is wat ik nodig had.
Hartelijk bedankt.
Met vriendelijke groeten
Marcel
Topic mag gesloten worden.
Wie op zijn afkomst pocht, is als een aardappel: het beste deel zit onder de grond.