• Registered: 2009-12-19
  • Posts: 3

Topic: SimpleViewer positioning problem with another scrooling menu script

Hello everybody!

I'm a new user of SimpleViewer and I want to embed it on my website. I want also to use a scrolling menu on the left side of the screen to change the gallery. Here is my website (it's under construction ;)):
http://www.flocool.fr/test/portfolio.php

As you can see, the scrolling menu is on the left-side of the screen, and simple viewer is a bit underneath. If I remove the menu, SimpleViewer is at the center of the sceen.

On the following messages, you will see the pages' code.
Do you know where the problem is?

  • Registered: 2009-12-19
  • Posts: 3

Re: SimpleViewer positioning problem with another scrooling menu script

portfolio.php

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en">
    <head>
        <title>SimpleViewer Gallery</title>
        <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
        <link href="main.css" rel="stylesheet" type="text/css" media="all">

        <?php
        include("galerie_script.php");
        ?>

    </head><body>

    <?php
    include("haut.php");
    ?>
    
<div id="support" style="position:relative; width:90px; height:280px; overflow:hidden; border:1px solid #222;">    
    <div id="contenu" style="position:absolute; top:0;">
        <font size="-1">Shoots<br /><br />1er shoots<br />ligne3<br />ligne4<br />ligne5<br />ligne6<br />

        ligne7<br />ligne8<br />ligne9<br />ligne10<br />ligne11<br />ligne12<br />Heathermarie<br />
        ligne14<br />ligne15<br />ligne16<br />ligne17<br />ligne18<br />Heathermarie<br />FIN<br /></font>

    </div>
    <div style="width:22px; height:280px; position:absolute; right:0;">
        <img onmouseover="moveLayer(1);" onmouseout="clearTimeout(Timer);" src="design/slideup.png" style="cursor:pointer; position:absolute; right:0;">
        <img onmouseover="moveLayer(-1);" onmouseout="clearTimeout(Timer);" src="design/slidedown.png" style="cursor:pointer; position:absolute; right:0; bottom:0;">        
    </div>
</div>

    
    <div id="flashContent">SimpleViewer requires JavaScript and the Flash Player. <a href="http://www.adobe.com/go/getflashplayer/">Get Flash.</a>.</div>
        
    <?php
    include("bas.php");
    ?>
    
    </body>
</html>

galerie_script.php

        <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/swfobject/2.2/swfobject.js"></script>
        <script type="text/javascript">
            var flashvars = {};
            flashvars.galleryURL = "gallery.xml";
            //flashvars.firstImageIndex = "0";
            //flashvars.preloaderColor = "#FFFFFF";
            var params = {};
            params.wmode="transparent";
            params.allowfullscreen = true;
            params.allowscriptaccess = "always";
            params.bgcolor = "111111";
            swfobject.embedSWF("simpleviewer.swf", "flashContent", "100%", "100%", "9.0.124", false, flashvars, params);
        </script>
        
<script language="javascript" type="text/javascript">
var Timer=null;
var Pas = 3;
function moveLayer(Sens) {
    var Objet=document.getElementById("contenu");
    if(parseInt(Objet.style.top) + (Pas*Sens)>0)  {
        clearTimeout(Timer);
    }
    else if(parseInt(Objet.style.top) + (Pas*Sens)<-(Objet.offsetHeight-document.getElementById("support").offsetHeight)) {
        clearTimeout(Timer);
    }
    else {
        Objet.style.top = (parseInt(Objet.style.top) + (Pas*Sens)) + "px";
    }
    Timer = setTimeout("moveLayer(" + Sens + ");", 30);
}
</script>

main.css

@charset "utf-8";
/* CSS Document */

html, body    { height:95%; }
body {
    background:#111 url(design/bottom-left-bg.jpg) no-repeat fixed left bottom;
    margin:0;
    padding:0;
    overflow:auto;
    color:#666;
    font-family:sans-serif;
    font-size:20px;
    height:95%;
}
.img_top {
    position:fixed;
    top:Opx;
    left:0px;
}
div#piedpage {
    position:fixed;
    text-align:right;
    padding-top:10px;
    bottom:0px;
    right:0px;
    padding-right:10px;
    font-size:12px;
    height:20px;
}
div#support {
    position:absolute;
    left:35px;
    top:115px;
}
a {
    color:#06F;
    text-decoration:none;
}
a:hover {
    color: #FFFFFF;
    text-decoration:none;
}
  • Felix
  • Site Admin
  • Offline
  • Registered: 2006-03-16
  • Posts: 4,395

Re: SimpleViewer positioning problem with another scrooling menu script

Hi,

unfortunately we cannot provide support for HTML and CSS issues.

Felix Turner
SimpleViewer Support Team.

Felix's Website

  • Registered: 2009-12-19
  • Posts: 3

Re: SimpleViewer positioning problem with another scrooling menu script

Hi,

I understand very well, but the problem is we don't know how works SimpleViewer, so anyone cannot know what the problem is, excepting you.
I hope you'll be able to help me.

Thanks