Differences

This shows you the differences between two versions of the page.

Link to this comparison view

Both sides previous revisionPrevious revision
Next revisionBoth sides next revision
en:create:popup [23.04.2015 14:12] – [Click to Show Information] adminen:create:popup [18.06.2015 14:16] admin
Line 269: Line 269:
 </script> </script>
 </code> </code>
 +
 +
 +==== Enlarge an Image ====
 +
 +Using an image as button, and a larger version of the image as "information", you may create a zoom feature. Simply give the images some HTML ID and take care of the larger version's placement.
 +
 +<code html>
 +<div style="position: relative; left: -100px; top: -100px">
 +  <img src="imageA.large.jpg" id="large1" />
 +</div>
 +<img src="iamgeA.jpg" id="image1" />
 +
 +<script type="text/javascript">
 +<!--
 +var info = new infoButton();
 +info.registerInfo("image1", "large1", "large1");
 +//-->
 +</script>
 +</code>
 +
 +There is no distinct close button in the example, above -- the larger version itself may be clicked to close the zoom.
  
  
en/create/popup.txt · Last modified: 13.07.2021 11:19 by sophia.schauer
 
Except where otherwise noted, content on this wiki is licensed under the following license: CC Attribution-Share Alike 4.0 International
Driven by DokuWiki