slide out footer div not working with IE

**shas1280** · 07-04-2010, 07:20 AM

HI friends..
i am trying to create a slide out footer div and its working for safari,firefox ect...but not working only with Interner Explorer. can any one fix this for me.
i am attaching the javascript and html code below

Thank you

HTML Code:

<!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">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>slide out footer</title>
<style type="text/css">
<!--
body {
	margin: 0px;
}
#footer {
	height: 37.5px;
	width: 100%;
	position: fixed;
	bottom: 0px;
	background-color: #333333;
	float: left;
}
#footer_inner {
	width: 100%;
	height: 57px;
	float: left;
	background-repeat: repeat-x;
	background-color: #999999;
	position: relative;
	background-image: url(../images/footer_bg.png);
}
-->
</style>
<script src="http://www.getreal.com.kw/blogsource/footer/jquery.js"></script>
</head>
<body>
<div id="footer" >
<div id="footer_inner">
</div></div>
<script type="text/javascript" src="http://www.getreal.com.kw/blogsource/footer/hover-jquery.js"></script>
</body></html>

**jscheuer1** · 07-04-2010, 08:36 AM

This:

Code:

original = parseInt(this.offsetbottom);

is NaN (there is no property offsetbottom). In Firefox, that results in:

Warning: Error in parsing value for 'top'. Declaration dropped.
Source File: test/hover_2_h.htm
Line: 0

for the animation. In IE, I assume that rather than drop the declaration, it tries to do it, but gets confused. Ultimately, all you really need to animate here is the height (and that's all it's doing in Firefox anyway). So you can change your hover-jquery.js to:

Code:

var original = false;
$("#footer").hover(
  function(){
    $(this).stop().animate({ height : "225px" }, 350);
  },
  function(){
   $(this).stop().animate({ height : "57px" }, 350);
  }
);

This will work in virtually any browser that supports the fixed position applied to the footer division in your style section. That would be almost all modern browsers, including IE 7+.

**shas1280** · 07-04-2010, 11:16 AM

sorry dear... i need to reopen this topic bcz didn't solve my problem and still i facing this problem. i hope you help again.

thank you

Thread: slide out footer div not working with IE

Thread Tools

Search Thread

slide out footer div not working with IE

The Following User Says Thank You to jscheuer1 For This Useful Post:

Bookmarks

Bookmarks

Posting Permissions