Jump to content
Search Community

Mekong

Members
  • Posts

    3
  • Joined

  • Last visited

Mekong's Achievements

0

Reputation

  1. Mekong

    IE 8 - Jerky Tween

    Sorry .... here are the zipped files (GS-Test.zip). Also, just out of interest, I tested the file in IE9 ... no problems, the tween worked well. Regards, Mekong GS-Test.zip
  2. Mekong

    IE 8 - Jerky Tween

    Hi Jack, Thanks for your reply. I think you are correct that the problem comes down to IE8 limitations (and the large image it has to deal with). Anyhow, attached are the relevant files. If you get the chance it would be great if you could look at them to double check I haven't done anything too dumb. Note that the HTML file is really simple. I was just trying to get the basic code working. Many thanks, Mekong basic_test.html
  3. Mekong

    IE 8 - Jerky Tween

    Hi, Wondering if someone can offer advice. I've set up a simple tween using TweenMax. It works great in Firefox etc but, in IE8, the animation is very jerky to the point where I don't think it's usable. I've checked out this forum (and the web in general) for any info. or fixes that might be available but can't find any solution. I wonder if anyone else has had this problem? I'm a newbie to this so maybe I've done something wrong. My HTML and JS code is shown below: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "[url="http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd%22>"]http://www.w3.org/TR...nsitional.dtd">[/url] <html xmlns="[url="http://www.w3.org/1999/xhtml%22>"]http://www.w3.org/1999/xhtml">[/url] <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>Untitled Document</title> <script type="text/javascript" src="[url="http://code.jquery.com/jquery-1.7.1.min.js%22></script>"]http://code.jquery.c...n.js"></script>[/url] <script type="text/javascript" src="src/minified/TweenMax.min.js"></script> <style type="text/css"> html, body { overflow:hidden; margin:0; } #nav{ position:fixed; left:0; bottom:0px; width:100%; height:70px; background-color:#000; z-index:100; font-family:Arial, Helvetica, sans-serif; border-top:#fff 1px solid; } #centre_nav{ width:300px; margin-left:auto; margin-right:auto; } #nav ul{ list-style-type:none; color:#fff; margin:0; padding:0; } #nav li{ padding-top:5px; float:left; } #main_pic{ position:absolute; left:0px; } </style> </head> <body> <div id="nav"> <div id="centre_nav"> <ul> <li><a href="#" class="main" onclick="go_home()"><img src="images/home_btn.jpg" width="96" height="45" /></a></li> <li><a href="#" class="main" onclick="go_about()"><img src="images/about_btn.jpg" width="96" height="45" /></a></li> <li><a href="#" class="main" onclick="go_contact()"><img src="images/contact_btn.jpg" width="96" height="45" /></a></li> </ul> </div> </div> <div id="main_pic"><img src="images/tattoo-4-bw.jpg" width="1800" height="531" id="header"/></div> <script language="Javascript" type="text/javascript"> function go_contact(){ var main_pic = document.getElementById("main_pic"); TweenLite.to(main_pic, 0.5, {css:{left:"1800px"}}); } </script> </body> </html>
×
×
  • Create New...