Показать сообщение отдельно
  #20 (permalink)  
Старый 24.02.2016, 17:44
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,109

olmensk,
о наконецто bottom2
<!DOCTYPE HTML>

<html>

<head>
  <title>Untitled</title>
  <meta charset="utf-8">
  <style type="text/css">
    .bottom1{
         border: 1px dashed Gray; padding: 5px; height: 100px; width: 100px
    }
    .bottom2{
        background-color: #FF00FF;
         color: #FFFF00;
    }

    .active {
        border: 1px  solid  #FF0000;
    }

  </style>
   <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js"></script>
   <script>
   $(function(){
$(".list3 li").on("click", function() {
var url = $("img",this).data("img"),
     title = $("img",this).data("title");
$(".list3 li").not($(this).addClass("active")).removeClass("active");
$('.bottom1').css('background','url('+url+') repeat')
$('.bottom2').html(title);
})
   })
  </script>
</head>

<body>
<div class="bottom1"></div>
<div class="bottom2"></div>


<ul class="list3">
 <li  ><img src="http://fancyapps.com/fancybox/demo/1_s.jpg" data-img="http://javascript.ru/forum/images/ca_serenity/misc/logo.gif" data-title= "фигня всякая"></li>
  <li  ><img src="http://fancyapps.com/fancybox/demo/1_s.jpg" data-img="http://javascript.ru/forum/images/ca_serenity/misc/logo.gif" data-title= "всякая хрень"></li>

 </ul>
</body>

</html>
Ответить с цитированием