forked from jnunemaker/fancy-zoom
-
Notifications
You must be signed in to change notification settings - Fork 1
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Added readme and removed extra images.
- Loading branch information
1 parent
ad607a2
commit c322537
Showing
3 changed files
with
26 additions
and
0 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,26 @@ | ||
1. Add prototype, scriptaculous and fancy zoom to your page. | ||
<script type="text/javascript" src="js/prototype.js"></script> | ||
<script type="text/javascript" src="js/scriptaculous.js"></script> | ||
<script type="text/javascript" src="js/fancyzoom.js"></script> | ||
|
||
2. Start zooming. | ||
<script type="text/javascript"> | ||
$(document).observe('dom:loaded', function() { | ||
$$('a.fancy').each(function(el) { new FancyZoom(el); }); | ||
new FancyZoom('small'); | ||
new FancyZoom('medium'); | ||
// width and height are optional. defaults to css specifications of width and height. | ||
// if width and height are passed in, they override whatever may be in css. | ||
new FancyZoom('large', {width:600, height:400}); | ||
}); | ||
</script> | ||
|
||
new FancyZoom(id) where id is the id of the <a> tag you would like to zoom. The <a> tag should have an href that anchors to the id of the box that contains the contents that should be zoomed. For example: | ||
|
||
<a href="#small_box" id="small">Small Box!</a> | ||
<div id="small_box"> | ||
<p>Here is the contents that will appear in the zoom.</p> | ||
</div> | ||
<script type="text/javascript"> | ||
new FancyZoom('small'); | ||
</script> |
Binary file not shown.
Binary file not shown.