• Registered: 2011-12-01
  • Posts: 25

Topic: Linking to a certain image

Hi all,

I want to link to a certain image in my gallery. I am a little confused with the directions.

Could anyone give me a more detailed laymen terms explanation of this please.

Thank you much!! :)

  • Registered: 2008-07-06
  • Posts: 6,330

Re: Linking to a certain image

For reference (and others reading this post) the instructions for direct linking to individual images can be found on the SimpleViewer-Pro API page.
There is an online example (within the link above) whose code you can use in your own gallery.
Essentially, add the file 'swfaddress.js' (which can be downloaded from this web page) to your gallery folder and use the following code as your gallery's 'index.html' page (instead of the default one generated by svBuilder-Pro).

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
    <meta http-equiv="content-type" content="text/html; charset=utf-8">
    <script type="text/javascript" src="svcore/js/simpleviewer.js"></script>
    <script type="text/javascript" src="swfaddress.js"></script>
    <script type="text/javascript">
        var svAPI;

        function svComplete() {
            svAPI = document.getElementById('svInstance');        
        };        
    
        function svImageChange(index){
            document.location="#" + (index + 1);
        }
        
        SWFAddress.onChange = function(){             
            if(svAPI != null && svAPI.getImageIndex() != getLocationIndex()) {
                svAPI.showImage(getLocationIndex());
            }
        }
        
        function getLocationIndex() {
            return location.hash.substr(1) - 1;
        }
 
        var flashvars = {};
        flashvars.enableAPI = true;                     
        flashvars.firstImageIndex = getLocationIndex();
        
        var attributes = {};
        attributes.id =  "svInstance"; 
        attributes.name = "svInstance";
        
        simpleviewer.ready(function () {
            svAPI = simpleviewer.load('sv-container', '100%', '100%', '222222', true, flashvars, null, attributes);
        });
                    
    </script>
    <title>SimpleViewer-Pro Gallery</title>
</head>
<body>
    <div id="sv-container"></div>
</body>
</html>

You can now refer to an individual image by using a URL such as:
http://www.example.com/gallery/#2 (to initially display the second image in the gallery).

Steven Speirs
SimpleViewer Support Team