парить (). не работает с изображениями внутри элемента кнопки в Firefox - PullRequest
Новая
       4

парить (). не работает с изображениями внутри элемента кнопки в Firefox

0 голосов
/ 04 февраля 2011

У меня есть скрипт, который меняет изображения при наведении курсора. Он работает со всеми изображениями в Mozilla, кроме случаев, когда у меня есть изображение внутри элемента кнопки. Хотя в IE он работает нормально.

Вот функция: 

$('.button').each(function(){
    var imgFile = $(this).attr('src') ;
    var preloadImage = new Image();
    var imgExt = /(\.\w{3,4}$)/;
    preloadImage.src = imgFile.replace(imgExt, '_over$1');
    $(this).hover(function(){
        $(this).attr('src', preloadImage.src);
    }, function(){
        $(this).attr('src', imgFile);
    });
});

Вот HTML: 

<div class='preview_bottom'>

<div class='bold'>
If you are ready<br> to submit: <br>

<form action="index.php?p=submit" method="post">
<p>
<button type="submit" name="submit"><img src="images/submit.jpg" alt="" class="button"/>    </button>
<input type="hidden" name="submitted2" value="TRUE">
</p>
</form>
</div>

<div class='bold'>
If you need to make any changes before submitting: <br>

<form action="index.php?p=preview" method="post">
<p>
<button type="submit" name="changeorder" ><img src="images/change.jpg" alt="" class="button"/></button>
</p>
</form>
</div>

</div>

Может ли кто-нибудь помочь мне заставить его работать в FF? Я пытался использовать first-child или find ("img") для элемента button, чтобы выбрать изображение внутри, но это совсем не работает.

1 Ответ

0 голосов
/ 04 февраля 2011

Попробуйте это: 

$('button').each(function(){
    var imgFile = $('.button',this).attr('src') ;
    var preloadImage = new Image();
    var imgExt = /(\.\w{3,4}$)/;
    preloadImage.src = imgFile.replace(imgExt, '_over$1');
    $(this).hover(function(){
        $('.button',this).attr('src', preloadImage.src);
    }, function(){
        $('.button',this).attr('src', imgFile);
    });
});
...