Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 17.08.2012, 23:02
Интересующийся
Отправить личное сообщение для Andrey_rtv Посмотреть профиль Найти все сообщения от Andrey_rtv
 
Регистрация: 17.08.2012
Сообщений: 14

Анимация в IE (проблема)
Мне надо было написать несложный JS анимацию, вот собственно и она:

function Start_animation() {
	 
	  var change = false;
	  var index_img = 0;	  
	  var class_this = this;
	  
	  this.images = function() { return new Array ('header', 'header_2', 'header_3'); }   
	  
	  this.animate = function() {		 

		   change = (change) ? (false) : (true);
		   
		   $('#header .header_img img').each(function (index, el) {   				
				 
			     if ($(el).closest('.header_img').css('opacity') == 0) $(el).attr('src', '/skin/img/BG/' + get_next() + '.png');

			   });
		  		 
		   $('#header #first_h').animate({opacity: (change) ? (0) : (1)}, 1500);
		   $('#header #second_h').animate({opacity: (change) ? (1) : (0)}, 1500);
		   		   
 
		   
		   setInterval(this.animate, 5000); 
		   
		  } 
		  
		  
	   var get_next = function() {
		   
		   index_img++;
		   
		   index_img = ((index_img + 1) <= class_this.images().length) ? (index_img) : (0);
		   
		   return class_this.images()[index_img]; 
		   
	   }
		  
	  
  }
  
  var Top_animation = new Start_animation();
  
  Top_animation.animate();

*** В массиве хранятся названия картинок, чтоб время на понимание сией ерунды не тратили.

Все отлично и прекрасно, но он не работает в IE. Дебажил - все норм src картинок меняется (правда скрипт вроде как иногда в IE останавливается ..), но animate не работает вообще.

Картинки в PNG-24, возможно связано с этим.

И дебагер IE ругался на: setInterval(this.animate, 5000); , вроде как невалидный аргумент .. Переправлял на
setInterval(function() { class_this.animate() }, 5000);, везде все работает, конечно же кроме IE

Очень прошу помочь знающий народ.

Заранее благодарен!!!

Последний раз редактировалось Andrey_rtv, 18.08.2012 в 03:50.
Ответить с цитированием
  #2 (permalink)  
Старый 18.08.2012, 00:00
без статуса
Отправить личное сообщение для Deff Посмотреть профиль Найти все сообщения от Deff
 
Регистрация: 25.05.2012
Сообщений: 8,219

Andrey_rtv,
Деио сайт есть ?
И юзайте правильную запись в топике - так - это не читабельно

http://javascript.ru/formatting
Ответить с цитированием
  #3 (permalink)  
Старый 18.08.2012, 00:32
Интересующийся
Отправить личное сообщение для Andrey_rtv Посмотреть профиль Найти все сообщения от Andrey_rtv
 
Регистрация: 17.08.2012
Сообщений: 14

Спасибо, ваш ответ многое прояснил ...

Насчет форматирования, код настолько просто, что необходимости в форматировании не видел, но вы, вообщем, правы, исправлюсь.

Домен сайта на разработку: http://abisoft.oliwa-pro.ru . Можете потестить.
Ответить с цитированием
  #4 (permalink)  
Старый 18.08.2012, 00:54
без статуса
Отправить личное сообщение для Deff Посмотреть профиль Найти все сообщения от Deff
 
Регистрация: 25.05.2012
Сообщений: 8,219

Andrey_rtv,
Сообщение от Andrey_rtv
Насчет форматирования, код настолько просто, ч
Гм - неужто сложно нажать кнопачку ? [JS]
function Start_animation() {

       var change = false;
       var index_img = 0; 
       var class_this = this;

       this.images = function() { return new Array ('header', 'header_2', 'header_3'); } 

           this.animate = function() { 

           change = (change) ? (false) : (true);

           $('#header .header_img img').each(function (index, el) { 

                if ($(el).closest('.header_img').css('opacity') == 0)  {
                       $(el).attr('src', '/skin/img/BG/' + get_next() + '.png');
                }

           });

           $('#header #first_h').animate({opacity: (change) ? (0) : (1)}, 1500);
           $('#header #second_h').animate({opacity: (change) ? (1) : (0)}, 1500);


           setInterval(this.animate, 5000); 

       } 


     var get_next = function() {

            index_img++;

            index_img = ((index_img + 1) <= class_this.images().length) ? (index_img) : (0);

            return class_this.images()[index_img]; 

     }

 }

 var Top_animation = new Start_animation();

 Top_animation.animate();

Так - Симпатичнее ?

Чичас гляну на сайт - правдо сплю уже

Последний раз редактировалось Deff, 18.08.2012 в 01:00.
Ответить с цитированием
  #5 (permalink)  
Старый 18.08.2012, 01:12
без статуса
Отправить личное сообщение для Deff Посмотреть профиль Найти все сообщения от Deff
 
Регистрация: 25.05.2012
Сообщений: 8,219

Andrey_rtv,
У Вас там две библиотеки jQuery
Переставьте Наверх с заменой или уберите 2 версию

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js" type="text/javascript"></script>
        <script type="text/javascript" src="http://code.jquery.com/jquery-latest.min.js"></script>
Ответить с цитированием
  #6 (permalink)  
Старый 18.08.2012, 01:20
Интересующийся
Отправить личное сообщение для Andrey_rtv Посмотреть профиль Найти все сообщения от Andrey_rtv
 
Регистрация: 17.08.2012
Сообщений: 14

Спасибо, что глянули. Попробую.

P.S. Насчет кнопочки вы правы
Ответить с цитированием
  #7 (permalink)  
Старый 18.08.2012, 01:27
Интересующийся
Отправить личное сообщение для Andrey_rtv Посмотреть профиль Найти все сообщения от Andrey_rtv
 
Регистрация: 17.08.2012
Сообщений: 14

Я убрал 1 библиотеку.

Очевидно, что ничего не заработало, т.к. при 2х библиотеках работали остальные элементы jQuery и в IE в том числе.

И вообще не очень понятно как они должны друг другу мешать .. пространство имен перезаписывают.

Но все равно спасибо за совет!
Ответить с цитированием
  #8 (permalink)  
Старый 18.08.2012, 01:38
sinistral
Посмотреть профиль Найти все сообщения от melky
 
Регистрация: 28.03.2011
Сообщений: 5,418

следите за this в Top_animation.animate.

подсказка - console.log
Ответить с цитированием
  #9 (permalink)  
Старый 18.08.2012, 01:46
без статуса
Отправить личное сообщение для Deff Посмотреть профиль Найти все сообщения от Deff
 
Регистрация: 25.05.2012
Сообщений: 8,219

Сообщение от Andrey_rtv
Очевидно, что ничего не заработало,
Если убирать - то самую нижнюю - хотя Оптимально поставить нижнюю наверх, вместо верхней - нижняя свежее
Ответить с цитированием
  #10 (permalink)  
Старый 18.08.2012, 03:04
Интересующийся
Отправить личное сообщение для Andrey_rtv Посмотреть профиль Найти все сообщения от Andrey_rtv
 
Регистрация: 17.08.2012
Сообщений: 14

melky - это напоминает код да винчи, осталось навести меня на путь тайной секты, владеющей сокральным знанием.

Если вас не затруднит - напишите четко, что вы хотели сказать.

В чем конкретно проблема?

class_this - this объекта Start_animation, ничего плохого пока не вижу.

Если в рекурсию поставить alert, то будет выводится сообщение. Проблема скорее всего в opacity и IE и PNG-24, хотя, возможно, я неправ.

Консоль IE ругался на неправильный аргумент
setInterval(this.animate, 5000);

, хотя после подстановки

setInterval(function() {class_this .animate()}, 5000)
- ошибка пропадает, но анимация не появляется.
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Проблема с обработкой ескольких .hover() anocean jQuery 3 15.06.2012 22:43
Проблема с Popup окном vovuslik jQuery 5 12.06.2010 16:12
Проблема с дизайном после отправки xmlhttprequest, Проблема с дизайном после отправки cyberx AJAX и COMET 3 01.05.2010 17:07
Проблема, в менюшке Большой джо Элементы интерфейса 0 12.07.2009 17:12
Цикличность анимация? SashaBorandi jQuery 1 25.12.2008 09:20