Javascript-форум (https://javascript.ru/forum/)
-   jQuery (https://javascript.ru/forum/jquery/)
-   -   Изменение значения атрибута. (https://javascript.ru/forum/jquery/17081-izmenenie-znacheniya-atributa.html)

tiros 05.05.2011 00:13

Изменение значения атрибута.
 
Господа, при реализации возникла проблема.
1. Имею:
Скрипт фотогаллереи (скачал из интернета). При наведении курсора фото увеличивается, при уводе курсора - уменьшается.

2. Что хотел получить?
После увеличения, если произведён клик , выбранное фото дополнительно появляется на новом месте. А при последующем наведении курсора на фото, оставшемся на прежнем месте, ничего не должно происходить.

3. Что делал.
В ссылку ввёл дополнительный атрибут «alt», и добавил выборку по атрибуту (выбор img не работает. Почему? Или я что-то не так делаю? ).

4. В чём проблема.
Изменяю атрибут (Пробовал по разному и с использованием bind, live. С live почему-то вообще у меня получается плохо.). При выводе атрибута через функцию «алерт», появляется сообщение, что атрибут изменился, но при повторных наведениях курсора вновь происходит выборка картинки и её увеличение. Чего, по идее, происходить не должно.
Если можно, подскажите, как решается проблема изменения атрибута в таком случае. Спасибо.

Скрипт:

function myClick(){
                                $(this). click (function(){
                               $(this).attr('alt',"myFlag");
                                alert($(this).attr('alt'));
                         });
                       };  

   function myHover1(){  
            $(this).css({'z-index' : '10'});
            $(this).find('img').stop()
            .animate({
               top: '-35px',
               left: '-35px',
               width: '120px',
               height: '120px'
            }, 400  , myClick
            );                 // Конец функции    animate
            $(this).append('<span>' + this.title + '</span>');
            $(this).find('span').hide();
            $(this).find('span').fadeIn(500);
         };                   //Конец функции  myHover1

   function myHover2(){              
            $(this).css({'z-index' : '0'});
            $(this).find('img').stop()
            .animate({
               top: '0',
               left: '0',
               width: '50px',
               height: '50px'
            }, 250);
            $(this).find('span').remove();
         };                   //Конец функции  myHover2 
         
$(document).ready(function(){           
$("#gallery a[alt != myFlag]").   hover    (myHover1,myHover2);
});//  Конец функции ready


Индекс -файл в урезанном виде:

<ul id="gallery">         
<li><a href="" title="Фото 1" alt = "myFlag"><img src=" photo1.jpg" width="50" height="50" alt="" /></a></li>
<li><a href="" title=" Фото2"  alt = "Photo"><img src=" photo 2.jpg" width="50" height="50" alt="" /></a></li>


Часовой пояс GMT +3, время: 10:45.