dark-angel-djin Geplaatst: 27 februari 2008 Delen Geplaatst: 27 februari 2008 hallo ik ben aan het proberen website te maken met wat foto's aleen wil ik als ik met muis over foto's ga dat die vergroten zonder klikken hoe kan ik dat doen ? Link naar reactie Delen op andere sites Meer opties om te delen...
Big fellow Geplaatst: 28 februari 2008 Delen Geplaatst: 28 februari 2008 Dat kan je volgens mij doen met de "overlib" javascripts... Zoek op google maar eens daar naar... Big fellow “Success is not final, failure is not fatal: it is the courage to continue that counts.” ~ Winston Churchill Link naar reactie Delen op andere sites Meer opties om te delen...
Puch Geplaatst: 28 februari 2008 Delen Geplaatst: 28 februari 2008 Dan kan met dreamweaver, echter moet je dan een plaats aanduiden waar die foto moet verschijnen. Als je het in een popup wil doen zou ik aanraden om een onclick event in te stellen. Als je een mouse over event zou instellen bij een popup dan gaat er telkens een venster openen als iemand met de muis over de foto gaat gaat, zeer vervelend als je het mij vraagt . Met een mouse over event kan je als volgt tewerk gaan. Je maakt een pagina aan met de thumbnails van de foto's die je wil weergeven. dan zet je ergens op dezelfde pagina een beginfoto. (bijvoorbeeld de grote afbeelding van de eerste thumbnail) Geef die foto ook een name en id. dit doe je door de image te selecteren en in het paneel onderaan een naam in te typen (links naast width en height van de image) Je html code moet er dan zo uitzien. <img src="images/naam.jpg" name="naam" id="naam" /> Op iedere thumbnail zet je een OnMouseOver swap event. On mouse out zet je niets. Je kan dit als volgt doen in dreamweaver. Selecteer de thumbnail. druk Shift+F4 het paneel behaviors zal open gaan. Klik op het plusteken en kies voor "afbeelden wisselen" (swap images mocht je een engelstalige dw hebben) Je zal de naam die je net hebt gegeven aan de afbeelding zien staan tussen aan halingstekens. Selecteer die. blader naar de afbeelding die moet getoond worden als je met de muis over de thumbnail gaat. Zet het vinkje af bij afbeeldigen herstellen OnMouseOut" KLik op ok Dit doe je met elke thumbnail. Als je nu de pagina opent zal de eerste afbeelding zichtbaar zijn. Ga je met de muis over een thumbnail zal de foto veranderen. Ik heb een klein voorbeeldje gemaakt klik Uiteraard moet je ervoor zorgen dat al je grote foto's dezelfde afmetingen hebben. Zo voorkom je vervorming zoals in mijn voorbeeld. Succes iMac 27" macOS SierraiPhone 5s iOS 10 Link naar reactie Delen op andere sites Meer opties om te delen...
dark-angel-djin Geplaatst: 28 februari 2008 Auteur Delen Geplaatst: 28 februari 2008 puch van harte bedank dat zal ook al voldoende zijn ga er zo snel mogelijk mee starten zo dra ik wat tyd kan maken toch ik zal laten weten hoe ver ik ermee ben Link naar reactie Delen op andere sites Meer opties om te delen...
lite Geplaatst: 28 februari 2008 Delen Geplaatst: 28 februari 2008 klein is fijn <html> <head> <script type="text/javascript"> function swap4all() { var images = document.getElementsByTagName('img'); for (var i = 0; i < images.length; i++) { images.style.position = 'absolute'; images.style.width = images.offsetWidth / 2; images.style.left = images.offsetWidth * i; images.style.zIndex = 99 - i; images.onmouseover = function() { this.style.width = this.offsetWidth * 2; } images.onmouseout = function() { this.style.width = this.offsetWidth / 2; } } } </script> </head> <body onload='swap4all();'> <img src="http://www.sat4all.com/forums/images/sat4all/logo.gif" alt="" /> <img src="http://www.hamar-trykk.no/images/Logo_TBAS_pms.jpg" alt="" /> </body> </html> And now for something completely similar Link naar reactie Delen op andere sites Meer opties om te delen...
dark-angel-djin Geplaatst: 1 april 2008 Auteur Delen Geplaatst: 1 april 2008 Origineel bericht van: lite klein is fijn <html> <head> <script type="text/javascript"> function swap4all() { var images = document.getElementsByTagName('img'); for (var i = 0; i < images.length; i++) { images.style.position = 'absolute'; images.style.width = images.offsetWidth / 2; images.style.left = images.offsetWidth * i; images.style.zIndex = 99 - i; images.onmouseover = function() { this.style.width = this.offsetWidth * 2; } images.onmouseout = function() { this.style.width = this.offsetWidth / 2; } } } </script> </head> <body onload='swap4all();'> <img src="http://www.sat4all.com/forums/images/sat4all/logo.gif" alt="" /> <img src="http://www.hamar-trykk.no/images/Logo_TBAS_pms.jpg" alt="" /> </body> </html> zeer mooi al ik nu de foto's ook nog eens in een layer kan laten opkomen zou af zijn hoe kan ik die in een layer zetten ? Link naar reactie Delen op andere sites Meer opties om te delen...
lite Geplaatst: 2 april 2008 Delen Geplaatst: 2 april 2008 Origineel bericht van: dark-angel-djin zeer mooi al ik nu de foto's ook nog eens in een layer kan laten opkomen zou af zijn hoe kan ik die in een layer zetten ? wat bedoel je precies met een layer..? And now for something completely similar Link naar reactie Delen op andere sites Meer opties om te delen...
dark-angel-djin Geplaatst: 10 april 2008 Auteur Delen Geplaatst: 10 april 2008 <html> <head> <script type="text/javascript"> function swap4all() { var images = document.getElementsByTagName('img'); for (var i = 0; i < images.length; i++) { images.style.position = 'absolute'; images.style.width = images.offsetWidth / 2; images.style.left = images.offsetWidth * i; images.style.zIndex = 99 - i; images.onmouseover = function() { this.style.width = this.offsetWidth * 2; } images.onmouseout = function() { this.style.width = this.offsetWidth / 2; } } } </script> <style type="text/css"> <!-- #apDiv1 { position:absolute; left:174px; top:129px; width:492px; height:103px; z-index:1; } #apDiv2 { position:absolute; left:117px; top:137px; width:568px; height:166px; z-index:1; } #apDiv3 { position:absolute; left:143px; top:137px; width:509px; height:149px; z-index:1; } --> </style> </head> <body onload='swap4all();'> <div id="apDiv3">hier</div>[/color] <img src="http://www.sat4all.com/forums/images/sat4all/logo.gif" alt="" /> <img src="http://www.hamar-trykk.no/images/Logo_TBAS_pms.jpg" alt="" /> </body> </html> LA IK DIE TUSSEN DIE DIV KON ZETTEN OF HIER TUSSEN <table width="399" height="252" border="1"> <tr> <th width="389" scope="col"> </th> </tr> </table> OF DERGELIJKE Link naar reactie Delen op andere sites Meer opties om te delen...
dark-angel-djin Geplaatst: 11 april 2008 Auteur Delen Geplaatst: 11 april 2008 duss ijgenlijk bij mousover dat de foto vergroot word in een image place holder de fotos wil ik in het klijn sorteren in kaders links en in het midden een grotere kaderzo dat als ik met muis er over loop dat de fotos vergroot worden ion de midenste grotere image holder Link naar reactie Delen op andere sites Meer opties om te delen...
Aanbevolen berichten
Maak een account aan of log in om te reageren
Je moet een lid zijn om een reactie te kunnen achterlaten
Account aanmaken
Registreer voor een nieuwe account in onze community. Het is erg gemakkelijk!
Registreer een nieuwe accountInloggen
Heb je reeds een account? Log hier in.
Nu inloggen