Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 22.02.2011, 16:04
Аспирант
Отправить личное сообщение для tazododu Посмотреть профиль Найти все сообщения от tazododu
 
Регистрация: 18.02.2010
Сообщений: 90

Пауза перед увеличением картини
Всем привет!!

Для увеличения картинки юзаю следующий скрипт

$("#goods_list_block .one_pp_wrap .pp_pic .product_pic").hover(
	function(){
		var name = $(this).attr('id');
		var pic_src = 'http://zakupka-images.s3.amazonaws.com/m_' + name;
		$(this).find("img").attr("src",pic_src);
	},
	function(){
		var name = $(this).attr('id');
		var pic_src = 'http://zakupka-images.s3.amazonaws.com/s_' + name;
		$(this).find("img").attr("src",pic_src);
	}
)


Работает правильно. Возникла необходимость сделать увеличение через 1 секунду после наведения на картинку. Если же за это время курсор отодвинули, картинку не менять.

Пробывал и так и сяк, ничего не получается. Прошу вашей помощи
Ответить с цитированием
  #2 (permalink)  
Старый 23.02.2011, 05:36
Аватар для FINoM
Новичок
Отправить личное сообщение для FINoM Посмотреть профиль Найти все сообщения от FINoM
 
Регистрация: 05.09.2010
Сообщений: 2,298

Немного говнокод, так как для более изящного решения нужно всё переписать
var show;
$("#goods_list_block .one_pp_wrap .pp_pic .product_pic").hover(
	function(){
        show = true;
		var name = $(this).attr('id');
		var pic_src = 'http://zakupka-images.s3.amazonaws.com/m_' + name;
		$(this).find("img").attr("src",pic_src);
                setTimeOut(function(){
                        show = false;
                },1000)
	},
	function(){
        if (!show) return false;
		var name = $(this).attr('id');
		var pic_src = 'http://zakupka-images.s3.amazonaws.com/s_' + name;
		$(this).find("img").attr("src",pic_src);
	}
)
Ответить с цитированием
  #3 (permalink)  
Старый 23.02.2011, 10:11
Аспирант
Отправить личное сообщение для tazododu Посмотреть профиль Найти все сообщения от tazododu
 
Регистрация: 18.02.2010
Сообщений: 90

FINoM
код работает неправильно, он в любом случае увеличивает картинку
Ответить с цитированием
  #4 (permalink)  
Старый 23.02.2011, 12:20
Аватар для micscr
Профессор
Отправить личное сообщение для micscr Посмотреть профиль Найти все сообщения от micscr
 
Регистрация: 10.09.2009
Сообщений: 1,577

var isIn = false; //  глобальные переменные
var newSrc = ''; // 
var obj = null;   // 
function doAfterSec(){
  if (!isIn) return;
  obj.attr('src', newSrc);
}
$("#goods_list_block .one_pp_wrap .pp_pic .product_pic").hover(
    function(){
        isIn = true;
        var name = $(this).attr('id');
        newSrc  = 'http://zakupka-images.s3.amazonaws.com/m_' + name;
        obj = $(this).find("img");
        setTimeout(doAfterSec, 1000);
    },
    function(){
        isIn = false;
        var name = $(this).attr('id');
        var pic_src = 'http://zakupka-images.s3.amazonaws.com/s_' + name;
        $(this).find("img").attr("src",pic_src);
    }
)

можно в принципе и clearTimeout использовать. кому как нравиться.
Ответить с цитированием
  #5 (permalink)  
Старый 23.02.2011, 13:58
Аспирант
Отправить личное сообщение для tazododu Посмотреть профиль Найти все сообщения от tazododu
 
Регистрация: 18.02.2010
Сообщений: 90

micscr
Спасибо за помощь!! Интересный подход, взял а заметку)
Ответить с цитированием
Ответ



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

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


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Подгрузка скрипта перед редиректом ссылки Cepin Javascript под браузер 4 10.12.2010 21:06
Удалить ряд символов перед или после курсора до определенного сивола brd Javascript под браузер 3 30.10.2009 08:20