Topic: Adding a header/footer picture

Hi guys,

I like to have a picture as header and a picture as footer for my gallery. Seems not to hard to do but i just cant figure out how to do it. Both header and footer pics has to be loaded from another location (website) so I fooled around abit with the fixed size index.html but got stuck..

This is the html file:


<!-- saved from url=(0014)about:internet -->
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>SimpleViewer</title>
<!-- Download SimpleViewer at www.airtightinteractive.com/simpleviewer -->
<script type="text/javascript" src="swfobject.js"></script>
<style type="text/css">   
    body {
        background-color: #ffffff;
        font: .8em/1.3em verdana,arial,helvetica,sans-serif;
    }

    #header {
        background-color: #dddddd;
        width: 100%;
        height: 60px;       
    }
   
    #footer {
        background-color: #dddddd;
        width: 100%;
        height: 40px;       
    }
   
    #flashcontent {
        width: 100%;
        height: 640px;       
    }
</style>
</head>
<body>
    <div id="header">This is the header. <a href="fixed_height.zip">Download this example here</a>.</div>
    <div id="flashcontent">SimpleViewer requires JavaScript and the Flash Player. <a href="http://www.macromedia.com/go/getflashplayer/">Get Flash.</a></div>   
    <script type="text/javascript">
   
        var fo = new SWFObject("viewer.swf", "viewer", "100%", "100%", "8", "#181818");
       
        // SIMPLEVIEWER CONFIGURATION OPTIONS
        // To use an option, uncomment it by removing the "//" at the start of the line
        // For a description of config options, go to:
        // http://www.airtightinteractive.com/simp … tions.html
       
        //fo.addVariable("xmlDataPath", "gallery.xml");
        //fo.addVariable("firstImageIndex", "5");   
        //fo.addVariable("langOpenImage", "Open Image in New Window");
        //fo.addVariable("langAbout", "About");   
        //fo.addVariable("preloaderColor", "0xFFFFFF");
       
        fo.write("flashcontent");   
    </script>   
    <div id="footer">This is the footer</div>
</body>
</html>

I think that this html file is almost ready to do the job but im not quite sure were to put the http://.... code for both header and footer.

Can you guys help me?

Thanx in advance!

Mike

Last edited by Cyborg1138 (2009-09-16 03:37:22)

Re: Adding a header/footer picture

Look in the pro download folder simpleviewer-pro\simpleviewer_pro\examples\HTML Embed\strip example or FAQ #9

http://www.simpleviewer.net/simpleviewe … ed_height/

Mike Richards
SimpleViewer Support Team.

Re: Adding a header/footer picture

Hi Miker,

Thanx for your support.
However, as you can see i already found that file as i posted that index file it into my previous post.

Can you tell me how to edit that file to load a picture for both header and footer from another location?
Im not ready familiar with html so i need the complete code here.

Thanx in advance!

Mike

Re: Adding a header/footer picture

edit <div id="header"></div> and <div id="footer"></div> to include your images.

Mike Richards
SimpleViewer Support Team.

Re: Adding a header/footer picture

Worked!

Thanx!