Differences

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

Link to this comparison view

Both sides previous revisionPrevious revision
Next revision
Previous revision
Last revisionBoth sides next revision
en:create:popup [23.04.2015 14:12] – [Click to Show Information] adminen:create:popup [07.09.2017 17:15] – [Hover over a Word Instead of Pressing a Button] autsch
Line 120: Line 120:
 ==== Hover over a Word Instead of Pressing a Button  ==== ==== Hover over a Word Instead of Pressing a Button  ====
  
-By slightly modifying this you can get rid of having to click, and therefore info box will be displayed when the user moves over a word:+By slightly modifying this you can get rid of having to click, and therefore the info box will be displayed when the user moves over a word:
  
 <code html> <code html>
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