Обращение к определенным аттрибутам

211

27 марта 2018, 03:04

Есть код:

<div class="TRP">
<h1>Top Rated Products</h1>
<div>
    <div>
        <img src="images/juice.jpg" alt="">
        <h1>Rose</h1>
        <a href="">learn more</a>
    </div>
    <div>
        <img src="images/juice.jpg" alt="">
        <h1>Rose</h1>
        <a href="">learn more</a>
    </div>
    <div>
        <img src="images/juice.jpg" alt="">
        <h1>Rose</h1>
        <a href="">learn more</a>
    </div>
</div>

Как применить замену картинки после наведения на объект, допустим на juice2.jpg?

Answer 1

Один из вариантов задать им отдельный class и по class-у производить те или иные действия...

$('.img-wrap').hover( 
  function() { 
    $(this).attr('src', 'https://s1.1zoom.ru/big0/34/322924-alexfas01.jpg') 
  }, 
  function() { 
    $(this).attr('src', 'https://s1.1zoom.ru/big3/753/371608-svetik.jpg') 
  });

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
<img class="img-wrap" src="https://s1.1zoom.ru/big3/753/371608-svetik.jpg" width="100" height="100" alt=""> 
<img class="img-wrap" src="https://s1.1zoom.ru/big3/753/371608-svetik.jpg" width="100" height="100" alt=""> 
<img class="img-wrap" src="https://s1.1zoom.ru/big3/753/371608-svetik.jpg" width="100" height="100" alt="">