Здравствуйте У меня несколько вопросов для более сведущих людей чем я... 1. (наверное слишком глупый... но все же): в опера с альфа слоями работает... а в IE нет... что можно сделать чтобы это дело заработало? 2. Я хочу сделать чтобы при наведении на картинку происходило движение до нужного мне момента, после того как она доезжает должна происходить другая анимация кнопок на этой картинке... но я не знаю как мне их связать чтобы они вместе двигались, но при этом чтобы к кнопкам не привязывался скрипт первого движения... очень надеюсь на вашу помощь! (очень надеюсь на то, что вы поймете что я имел ввиду.. т.к. сам с трудом понимаю что написал.. ) для наглядности ссылка и код: http://aionfantasy.com/ <!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>TesseracT TEAM</title> <script type="text/javascript" src="js/jquery.js"></script> <script type="text/javascript" src="js/interface.js"></script> <script type="text/javascript" src="js/interfac.js"></script> <script type="text/javascript" src="js/jquery00.js"></script> <style type="text/css" media="all"> <!-- body { background-color: #FFFFFF; background-image: url(img/bg.jpg); background-repeat: no-repeat; background-position: top; margin: 0; padding: 0; } .ifxElement1 { } .tabContent { } .test { } --> </style> </head> <body> <div align="center"> <img src="img/btn_top.png" /> </div> <div align="center"> <span style='position:relative;z-index:5;right:0px;top:80px;'> <img src="img/C_I_form.png" /> </span> </div> <div align="center"> <div id="easing" class="tabContent"> <a href="#" onmouseover="animateEl4(); return false;"> <div id="ifxElement4" class="ifxElement" style='position:absolute;z-index:2;right:540px;top:360px;'> <img src="img/smal_C_form.png"/> </div> </a> </div> <div id="easing" class="tabContent"> <a href="#" onmouseover="animateEl2(); return false;"> <div id="ifxElement2" class="ifxElement" style='position:absolute;z-index:1;right:540px;top:120px;'> <img src="img/smal_C_form.png" /> </div> </a> </div> <div id="easing" class="tabContent"> <a href="#" onmouseover="animateEl(); return false;"> <div id="ifxElement" class="ifxElement" style='position:absolute;z-index:4;left:540px;top:120px;'> <img src="img/smal_C_form.png" /> </div> </a> </div> <div id="easing" class="tabContent"> <a href="#" onmouseover="animateEl3(); return false;"> <div id="ifxElement3" class="ifxElement" style='position:absolute;z-index:3;left:540px;top:360px;'> <img src="img/smal_C_form.png" /> </div> </a> </div> </div> <script type="text/javascript"> var currentTab = null; var inSlide = false; $(document).ready( function() { var url, tab = 0, tabIteration = 0; $('#scroll').ScrollToAnchors(500); url = window.location.href.split("#"); if (url.length == 2 && url[1].indexOf('-fx') > 0) { currentTab = $('#' + url[1].substr(0, url[1].length-3)); if (currentTab.size() == 1) { $('#fx div').each( function(iteration) { if(this === currentTab.get(0)) { tabIteration = iteration; } } ); } } if(!currentTab) { currentTab = $('#fx div:first'); } currentTab.SlideToggleUp(4000); $('#tabs a') .eq(tabIteration).addClass('active') .end() .bind('click', switchTab); } ); var switchTab = function() { var tabName = this.href.split('#')[1]; this.blur(); if (inSlide == false && currentTab.get(0) != $('#' + tabName.substr(0, tabName.length-3)).get(0)) { $('#tabs a').removeClass('active'); $(this).addClass('active'); inSlide = true; currentTab.SlideToggleUp( 400, function() { currentTab = $('#' + tabName.substr(0, tabName.length-3)).SlideToggleUp(400, function(){inSlide=false;}); } ); } else { return false; } }; var animateEl = function() { var el = $('#ifxElement'); if(parseInt(el.css('left')) > 350) { el.animate({left: 350}, 2000, $('input[@checked]').val()); } else { el.animate({left: 540}, 2000, $('input[@checked]').val()); } return false; }; var animateEl2 = function() { var el = $('#ifxElement2'); if(parseInt(el.css('right')) > 350) { el.animate({right: 350}, 2000, $('input[@checked]').val()); } else { el.animate({right: 540}, 2000, $('input[@checked]').val()); } return false; }; var animateEl3 = function() { var el = $('#ifxElement3'); if(parseInt(el.css('left')) > 350) { el.animate({left: 350}, 2000, $('input[@checked]').val()); } else { el.animate({left: 540}, 2000, $('input[@checked]').val()); } return false; }; var animateEl4 = function() { var el = $('#ifxElement4'); if(parseInt(el.css('right')) > 350) { el.animate({right: 350}, 2000, $('input[@checked]').val()); } else { el.animate({right: 540}, 2000, $('input[@checked]').val()); } return false; } </script> </body> </html> Также хотел бы услышать где и что я сделал не так или можно сделать по другому и лучше...
