Форум

Radioactive · #1 (**permalink**) 23.01.2014, 17:46

Вот такой набросок имеется http://jsfiddle.net/2eymU/
Прошу помоч сделать простую сортировку по "тегам"
Нажал на город > города с этим тегом в начало списка

рони · #2 (**permalink**) 23.01.2014, 18:35

Radioactive,

<!DOCTYPE html>
<html>
<head>
  <meta http-equiv="content-type" content="text/html; charset=UTF-8">
  <title> - jsFiddle demo</title>
  <script src="http://code.jquery.com/jquery-1.9.1.js"></script>
  <style type='text/css'>
    ul{list-style:none;margin:0;padding:0;}
ul li{text-align:center;}
ul:nth-child(1){width:100%;max-width:102px;float:left;}
ul:nth-child(2){display:table-cell;padding:0 5px;width:316px;}
ul:nth-child(1) li{border:1px solid #ddd;width:80px;padding:5px 10px;background-color:#CC9B00;border-radius:4px;margin:5px 0;cursor:pointer;font:.9em/normal sans-serif;}
ul:nth-child(2) li{height:70px;width:70px;border:1px solid #ddd;display:inline-block;background-color:#9CB7F1;line-height:70px;margin: 4px 2px;}
  </style>



<script>
$(function () {
    $("#listbutcity").on("click", "li", function (a) {
        var cls = '.'+$(this).data('name'),
        city = $('#listcity'), li = $(cls,city);
        city.prepend(li)
    });
})
</script>
</head>
<body>
  <ul id="listbutcity">
    <li data-name="ufa">Уфа</li>
    <li data-name="Moskov">Москва</li>
    <li data-name="bratsk">Братск</li>
</ul>

<ul id="listcity">
    <li class="Moskov">Moskov</li>
    <li class="ufa">ufa</li>
    <li class="bratsk">bratsk</li>
    <li class="Moskov">Moskov</li>
    <li class="bratsk">bratsk</li>
    <li class="ufa">ufa</li>
    <li class="Moskov">Moskov</li>
</ul>
</body>
</html>

Radioactive · #3 (**permalink**) 23.01.2014, 23:16

Рони, не первый раз меня выручаеш, низкий поклон за помощь

В процессе добавления скрипта возникла небольшая проблемка из за которой классы городов придётся добавлять средствами jquery

имеется такой код http://jsfiddle.net/RZdU2/
Там есть div.listnonecity в котором "список" городов которые нужно превратить в классы и данный массив добавить в главный родитель div.ja-cp-item
Тоесть получится например

Код:

<div class="ja-cp-item Moskov ekaterinburg">

таких блоков не один.. от меня минимум + в карму

рони · #4 (**permalink**) 23.01.2014, 23:43

Radioactive,

var $ja = $('.ja-cp-item');
 $ja.each(function (i, el) {
     var cls = $('.listnonecity', $(el)).text();
     $(el).addClass(cls)
 });

Radioactive · #5 (**permalink**) 24.01.2014, 00:26

Благодарю!
Немогу карму плюсануть, пишет надо комунить дать плюс, но я уже давал другому до этого плюс

Radioactive · #6 (**permalink**) 28.01.2014, 22:10

Прошу прощения но можно ли сделать так чтобы при нажатии на фильтр города без нужных классов были скрыты?
И можно ли сделать какнить анимацию, простую типа FadeIn на блоки вакансий

рони · #7 (**permalink**) 28.01.2014, 22:50

Radioactive,

Radioactive · #8 (**permalink**) 28.01.2014, 23:26

Форум

Справочник

Discord чат

Курсы javascript