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

Сообщение от рони Посмотреть сообщение
olmensk,
<!DOCTYPE HTML>

<html>

<head>
  <title>Untitled</title>
  <meta charset="utf-8">
  <style type="text/css">
    .bottom{
         border: 1px dashed Gray; padding: 5px; height: 100px; width: 100px
    }
    .bottom span{
        background-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");
$('.bottom').css('background','url('+url+') repeat').find("span").html(title);
})
   })
  </script>
</head>

<body>
<div class="bottom"><span></span></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>

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

Вы смысл правильно уловили, но не до конца)) Я к сожалению слабо работаю с JQuery, поэтому прошу помочь. ))
Ответить с цитированием