Javascript Zoom Beispiel

Oft möchte man auf einer Webseite gleichzeitig eine Reihe von Vorschaubildchen zeigen, die schnell geladen sind. Der Besucher soll aber auch je eine grosse Version davon ansehen können, ohne dass er zwischen mehreren Seiten hin und her navigieren muss. Hier die Lösung:

Bild vergrössern Bild vergrössern

Klicke auf ein Bild um die Zoom-Funktion in Aktion zu sehen!

Beachte, dass die grossen Bilder bereits beim Betrachten der Vorschaubilder im Hintergrund nachgeladen werden, sodass sie in der Regel beim Anklicken der Vorschau ohne Verzögerung sofort erscheinen!


Deprecated: Directive 'allow_url_include' is deprecated in Unknown on line 0
vConsole
21:40:37
Uncaught TypeError: Cannot read properties of null (reading 'style')
/andere/index.php?name=image_zoom.php:5446:53
21:40:37
Uncaught SyntaxError: Unexpected token '<'
/js/index.php?js=3.2.1-jquery.min.js:4:22481
21:40:37
Uncaught SyntaxError: Unexpected token '<'
/js/index.php?js=MooTools.min.js:5:5095
21:40:37
Uncaught SyntaxError: Unexpected token '<'
/js/index.php?js=EnlighterJS.min.js:3:17773
21:40:37
Uncaught TypeError: window.addEvent is not a function
/andere/index.php?name=image_zoom.php:2786:8
21:40:37
Uncaught SyntaxError: Unexpected token '<'
/js/index.php?js=pace.js:896:26
21:40:37
Uncaught SyntaxError: Unexpected token '<'
/js/index.php?js=cookieconsent.min.js:1:20809
21:40:38
Uncaught SyntaxError: Unexpected token '<'
/js/alljs.php:408:2
21:40:37
WeChatLib: 0 (xxxx.xx.xx)
21:40:38
System: Unknown
21:40:38
Protocol: HTTPS
21:40:38
UA: Mozilla/5.0 AppleWebKit/537.36 (KHTML, like Gecko; compatible; ClaudeBot/1.0; +claudebot@anthropic.com)
21:40:38
navigationStart: 1743975636467
21:40:38
navigation: 11ms
21:40:38
dns: 52ms
21:40:38
tcp (ssl): 221ms (112ms)
21:40:38
request: 421ms
21:40:38
response: 219ms
21:40:38
domComplete (domLoaded): 893ms (832ms)
21:40:38
loadEvent: 20ms
21:40:38
total (DOM): 1622ms (1602ms)