PDA

View Full Version : Floating Menu in iFrame



psenechal
02-24-2006, 09:15 PM
Hello,

I'm currently using this really cool script:

http://www.dynamicdrive.com/dynamicindex1/staticmenu.htm

The script works perfectly by itself:

http://www.raptorconcepts.net/config/index.php?comp=F22

However, I'm trying to use the wrapper feature in my Joomla CMS installation to include this page in an iFrame. Unfortunately, it's causing the floating menu to simply drop all the way to the bottom of the screen. I'm assuming this is because it's generating the position from the iFrame instead of the parent window. I've tried modifying the script by adding parent, top, iframe to the some of the calculations for clientheight, but nothing seems to work. Does anyone know how to modidy the script so that the iFrame doesn't mess up the position calcualtion? Here is the script currently in use:


<script type="text/javascript">

/*
Floating Menu script- Roy Whittle (http://www.javascript-fx.com/)
Script featured on/available at http://www.dynamicdrive.com/
This notice must stay intact for use
*/

//Enter "frombottom" or "fromtop"
var verticalpos="frombottom"

if (!document.layers)
document.write('</div>')

function JSFX_FloatTopDiv()
{

ns4 = (document.layers)? true:false;
ie4 = (document.all)? true:false;
winW = (ns4)? window.innerWidth-16 : document.body.offsetWidth-20;

var startX = 135,
startY = 225;
var ns = (navigator.appName.indexOf("Netscape") != -1);
var d = document;
function ml(id)
{
var el=d.getElementById?d.getElementById(id):d.all?d.all[id]:d.layers[id];
if(d.layers)el.style=el;
el.sP=function(x,y){this.style.left=x;this.style.top=y;};
el.x = startX;
if (verticalpos=="fromtop")
el.y = startY;
else{
el.y = ns ? pageYOffset + innerHeight : document.body.scrollTop + document.body.clientHeight;
el.y -= startY;
}
return el;
}
window.stayTopLeft=function()
{
if (verticalpos=="fromtop"){
var pY = ns ? pageYOffset : document.body.scrollTop;
ftlObj.y += (pY + startY - ftlObj.y)/8;
}
else{
var pY = ns ? pageYOffset + innerHeight : document.body.scrollTop + document.body.clientHeight;
var pX = ns ? pageXOffset + innerWidth : document.body.scrollLeft + document.body.clientWidth;
ftlObj.y += (pY - startY - ftlObj.y)/8;
ftlObj.x += (pX - startX - ftlObj.x)/8;
}
ftlObj.sP(ftlObj.x, ftlObj.y);
setTimeout("stayTopLeft()", 10);
}
ftlObj = ml("divStayTopLeft");
stayTopLeft();
}
JSFX_FloatTopDiv();
</script>

<SCRIPT Language="JavaScript">

Any assistance is greatly appreciated. Thanks

psenechal
02-24-2006, 09:16 PM
oooops...forgot to include the URL of the Joomla installation:

http://www.raptorconcepts.net (http://www.raptorconcepts.net/index.php?option=com_wrapper&Itemid=8)

psenechal
02-27-2006, 06:17 AM
Well...I resolved the issue by implementing the script differently in Joomla using a PHP include instead of the wrapper feature. This way it just pulls the page into the site instead of populating it an iframe.

http://www.raptorconcepts.net/index.php?option=com_content&task=view&id=166&Itemid=36

So...the problem I'm having now is that the horizontal scrollbar is providing space to let the user scroll more to the right, which then moves the floating menu more to the right.

Is there something in the script I can alter or remove to stop the extra horizontal space on the scroll bar? Thanks.