I am trying to make a div move back and forwards on the x axis but not
change its y postion using Move
This works as expected in Firefox but not in IE.
In IE the div moves up to the top of the page instead of staying at the
same y position
Is there anything obvious I am doing wrong?
code is below
<html>
<head>
<title>TITLE</title>
<script type="text/javascript" src="javascript/prototype-1.6.0.3.js"
></script>
<script type="text/javascript" src="javascript/scriptaculous.js"
></script>
<style type="text/css">
#menuhide {
width: 100%;
}
div#centercol {
position: absolute;
left: 208;
}
#header {
width: 100%;
}
#content {
float: left;
clear: both;
}
div#leftcol{
position: absolute;
left: 8;
}
#menucol {
width: 200px;
float: left;
}
</style>
</head>
<body>
<div id="menuhide">
<span id="hidebutton" class="hand">Hide Menu <<</span>
</div>
<div id="centercol">
<div>
<div id="header">
HEADER
</div>
<div id="content">
CONTENT
</div>
</div>
</div>
<div id="leftcol">
<div id="menucol">
MENU
</div>
</div>
<script type="text/javascript">
function toggle_menu(event) {
var butt = $('hidebutton');
if( show_menu > 0 ) {
new Effect.Move( 'centercol', { x: -200, y: 0, position:
'relative' } );
butt.innerHTML = 'Show Menu >>';
show_menu = 0;
}
else {
new Effect.Move( 'centercol', { x: 200, y: 0, position:
'relative' } );
butt.innerHTML = 'Hide Menu <<';
show_menu++;
}
}
</script>
<script type="text/javascript">
$('hidebutton').observe( 'click', function( event ){
toggle_menu( event );
});
var show_menu = 1;
</script>
</body>
</html>
Thanks
Mike
--~--~---------~--~----~------------~-------~--~----~
You received this message because you are subscribed to the Google Groups
"Prototype & script.aculo.us" group.
To post to this group, send email to prototype-scriptaculous@googlegroups.com
To unsubscribe from this group, send email to
prototype-scriptaculous+unsubscr...@googlegroups.com
For more options, visit this group at
http://groups.google.com/group/prototype-scriptaculous?hl=en
-~----------~----~----~----~------~----~------~--~---
