Форум

ufaclub · #1 (**permalink**) 08.03.2014, 23:56

Есть код

<li style="background-image:url(http://newkrasinsky.ru/modules/mod_junewsultra/img/Li4vLi4vLi4vaS83YjQxZjA1NzVlYjEwYTEyNjYzNTMxMzYzMjI1MWYzNC5qcGcmYW1wO3c9MzIwJmFtcDtoPTAmYW1wO3E9MTAwJmFtcDt6Yz0w_junus.jpg); background-repeat:no-repeat">
<h2><span><a href="/svejie-ogurci.html">Свежие огурцы</a></span></h2>
<div class="meta floatleft w">
<div class="author floatleft">06.03.2014</div><br>
<div id="intro">
Огурец обладает ценными диетическими и лечебными свойствами.  Замечательные вкусовые качества,...</div>
</div>


</li>

При наведение ставлю например новую картинку (или просто убираю текущую фоновую картинку) вот таким кодом

jQuery("ul#seo li#1").hover( function() {
jQuery("ul#seo li#1").css('background-image','none');
}, function() {
jQuery("ul#seo li#1").xxx();
});

как сделать отмену операции по смену фона после того как мышь будет отведена? - т.е нужно чтобы вернуться старый фон который был прописан в html

подскажите что заместо jQuery("ul#seo li#1").xxx(); написать?

рони · #2 (**permalink**) 09.03.2014, 00:17

ufaclub,

<html>

<head>
  <title>Untitled</title>
  <meta charset="utf-8">
  <script src="http://code.jquery.com/jquery-latest.js"></script>
</head>

<body><ul id="seo">


<li style="background-image:url(http://www.murmangid.ru/sites/default/files/news/2011-05/1306736673-9432.jpg); background-repeat:no-repeat">
<h2><span><a href="/svejie-ogurci.html">Свежие огурцы</a></span></h2>
<div class="meta floatleft w">
<div class="author floatleft">06.03.2014</div><br>
<div id="intro">
Огурец обладает ценными диетическими и лечебными свойствами.  Замечательные вкусовые качества,...</div>
</div>


</li></ul>
<script>

jQuery("#seo li").hover( function() {
var image = jQuery(this).css('background-image');
jQuery(this).data({'background':image})
.css({'background-image':'none'});
}, function() {
var image = jQuery(this).data('background')
jQuery(this).css({'background-image':image});
});

</script>
</body>

</html>

ufaclub · #3 (**permalink**) 09.03.2014, 00:22

Спасибо! ПОМОГ!

danik.js · #4 (**permalink**) 09.03.2014, 00:36

Пиздец вы лохи

<html>
 
<head>
  <title>Untitled</title>
  <meta charset="utf-8">
  <style>
    #seo li:hover{
        background-image: none !important;
    }
  </style>
</head>
 
<body><ul id="seo">
 
 
<li style="background-image:url(http://www.murmangid.ru/sites/default/files/news/2011-05/1306736673-9432.jpg); background-repeat:no-repeat">
<h2><span><a href="/svejie-ogurci.html">Свежие огурцы</a></span></h2>
<div class="meta floatleft w">
<div class="author floatleft">06.03.2014</div><br>
<div id="intro">
Огурец обладает ценными диетическими и лечебными свойствами.  Замечательные вкусовые качества,...</div>
</div>
 
 
</li></ul>
</body>
 
</html>

рони · #5 (**permalink**) 09.03.2014, 00:55

danik.js,
ничё ты не понимаешь мы же тут для ие 7 стараемся

ufaclub · #6 (**permalink**) 09.03.2014, 01:53

Сообщение от рони

ufaclub,

<html>

<head>
  <title>Untitled</title>
  <meta charset="utf-8">
  <script src="http://code.jquery.com/jquery-latest.js"></script>
</head>

<body><ul id="seo">


<li style="background-image:url(http://www.murmangid.ru/sites/default/files/news/2011-05/1306736673-9432.jpg); background-repeat:no-repeat">
<h2><span><a href="/svejie-ogurci.html">Свежие огурцы</a></span></h2>
<div class="meta floatleft w">
<div class="author floatleft">06.03.2014</div><br>
<div id="intro">
Огурец обладает ценными диетическими и лечебными свойствами.  Замечательные вкусовые качества,...</div>
</div>


</li></ul>
<script>

jQuery("#seo li").hover( function() {
var image = jQuery(this).css('background-image');
jQuery(this).data({'background':image})
.css({'background-image':'none'});
}, function() {
var image = jQuery(this).data('background')
jQuery(this).css({'background-image':image});
});

</script>
</body>

</html>

А как можно сделать чтобы заместо 'none" в строке .css({'background-image':'none'});

было имя произвольно картинки из списка [bg1.jpg,bg2.jpg,bg3.jpg,bg4.jpg] при учете что картинки будут лежать в корне сайта.

Deff · #7 (**permalink**) 09.03.2014, 05:10

<html>
<head>
  <title>Untitled</title>
  <meta charset="utf-8">
<script src="http://code.jquery.com/jquery-latest.js"></script>
  <style>
    #seo li.onhover:hover{
        background-image: none !important;
    }
  </style>
</head>
<body>
<ul id="seo">
<li class="onhover" style="background-image:url(http://newkrasinsky.ru/modules/mod_junewsultra/img/Li4vLi4vLi4vaS83YjQxZjA1NzVlYjEwYTEyNjYzNTMxMzYzMjI1MWYzNC5qcGcmYW1wO3c9MzIwJmFtcDtoPTAmYW1wO3E9MTAwJmFtcDt6Yz0w_junus.jpg); background-repeat:no-repeat">
<h2><span><a href="/svejie-ogurci.html">Свежие огурцы</a></span></h2>
<div class="meta floatleft w">
<div class="author floatleft">06.03.2014</div><br>
<div id="intro">
Огурец обладает ценными диетическими и лечебными свойствами.  Замечательные вкусовые качества,...</div>
</div>

</li>
</li></ul>

<script>
    $("#seo li.onhover").mouseleave(function(){
         $(this).removeClass("onhover");
    });
</script>

</body>
<html>

danik.js · #8 (**permalink**) 09.03.2014, 08:07

Сообщение от рони

ничё ты не понимаешь мы же тут для ие 7 стараемся

Он уже давно в гумус превратился вообще-то. На даже если, то что с ним не так?
:hover был сломан только в IE6.

рони · #9 (**permalink**) 09.03.2014, 09:33

Сообщение от danik.js

Он уже давно в гумус превратился вообще-то. На даже если, то что с ним не так?

а у вас нет на свалке ие7 чтобы проверить ваш код?

danik.js · #10 (**permalink**) 09.03.2014, 09:52

Сообщение от рони

а у вас нет на свалке ие7 чтобы проверить ваш код?

Я давно верстаю и знаю почти все распространенные баги IE. Правда для 6-7 уже забываю.

Форум

Справочник

Discord чат

Курсы javascript