переход изображения jquery

#javascript #jquery #animation

#javascript #jquery #Анимация

Вопрос:

У меня есть кнопка на веб-сайте, который я делаю для проекта колледжа (веб-сайт, который продает музыку). Я использую кнопку покупки, которая выглядит как кнопка из App Store от Apple:

изображение 1 http://ryanholder.co.uk/img/buy_button_5.99.png

изображение 2 http://ryanholder.co.uk/img/ibutton_buynow.png

Я хотел спросить, знает ли кто-нибудь какой-нибудь jQuery, который я мог бы использовать, или вы могли бы создать его, чтобы я мог щелкнуть по первому изображению, и оно перейдет ко второму изображению. Вроде как, если вы нажмете на него в реальном магазине приложений iTunes.

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

И прежде чем ты скажешь, чувак, это, очевидно, авторское право. Я использую этот дизайн для проекта колледжа, а не для реального веб-сайта;)

Заранее спасибо :)!!

Ответ №1:

http://designbeep.com/2010/05/13/25-very-detailed-jquery-image-and-content-slider-tutorials /. Будучи проектом колледжа, мы бы не хотели лишать обучение всего удовольствия.

Ответ №2:

 $('#my_button').click(function(){
   if ($(this).css('background-image') == 'first_image'){
      $(this).css('background-image', 'second_image')
   } else {
      $(this).css('background-image', 'first_image')
   }
})
  

Комментарии:

1. Я добавил Это: <script type=»text/javascript»> $(‘#buybutton’).click(function(){ if ($(this).css(‘background-image’) == ‘/img/album_covers/buy_button_5.99.png’){ $(this).css(‘background-image’, ‘/img/album_covers/ibutton_buynow.png’) } else { $(this).css(‘background-image’, ‘img/album_covers/buy_button_5.99.png’) } }) </script> and my div is called buybutton but it dident work, not sure what im doing wrong :/

Ответ №3:

Если бы вы поместили оба изображения в один файл, а затем просто изменили видимые координаты с помощью jquery. Выкапываю пример. BRB

Комментарии:

1. это приведет к ненужной загрузке изображений