Перейти к содержимому


Фотография
* - - - - 1 Голосов

Настроить фильтр

фильтр

Лучший Ответ xatberg , 02 November 2013 - 09:01

  1. media\zoo\applications\jbuniversal\assets\css\jbzoo.filter.css 
я когда экспериментировал в моем случае код был такой
  1. input#filterel128cad5a-5d2e-4f82-ba18-22e6d5009679belyj {
  2. display: none;
  3. }
  4.  
  5. input[type="checkbox"]:checked + label[for="filterel128cad5a-5d2e-4f82-ba18-22e6d5009679belyj"]{
  6. content: "";
  7. font-size: 0px;
  8. display: inline-block;
  9. height: 15px;
  10. margin:0;
  11. padding:0;
  12. width: 15px;
  13. border:1px #000 solid;
  14. background: #FFF;
  15. box-shadow:2px 2px 1px black;
  16. }
  17.  
  18. input[type="checkbox"] + label[for="filterel128cad5a-5d2e-4f82-ba18-22e6d5009679belyj"]{
  19. content: "";
  20. display: inline-block;
  21. height: 15px;
  22. width: 15px;
  23. border:1px #000 solid;
  24. border-radius:10px;
  25. font-size: 0px;
  26. background: #FFF;
  27. }
не забывайте что каждому чекбоксу присвоен id ( filterel128cad5a-5d2e-4f82-ba18-22e6d5009679belyj ) в Вашем случае цвет вот его и надо смотреть через firebug 
 
post-1991-0-49711700-1383378596_thumb.jp
 
если вместо цвета нужно поставить изображение то при небольших познаниях css  можно сделать вместо
  1.  
  2. background: #FFF;
  1.  
  2. background:url(images/изображенице.пнг);
вот кстати сайт Артура который реализовал цвета в фильтре Перейти к сообщению


  • Закрытая тема Тема закрыта
Сообщений в теме: 4

#1 Natali

Natali

Отправлено 01 November 2013 - 19:12

Помогите настроить фильтер, что бы вместо текстовой информации были картинки. Например вместо слова - бордовый маленькая картинка.

Прикрепленные изображения

  • 11.png

  • 0

#2 xatberg

xatberg

Отправлено 02 November 2013 - 04:45

если тот вариант непонравился вот еще 


  • 0

#3 Natali

Natali

Отправлено 02 November 2013 - 07:41

А скажите пожалуйста в каком файле (наименование файла и где он лежит) прописывать эти строчки и куда класть картинки которые должны погружаться?


  • 0

#4 xatberg

xatberg

Отправлено 02 November 2013 - 09:01   Лучший Ответ

  1. media\zoo\applications\jbuniversal\assets\css\jbzoo.filter.css 
я когда экспериментировал в моем случае код был такой
  1. input#filterel128cad5a-5d2e-4f82-ba18-22e6d5009679belyj {
  2. display: none;
  3. }
  4.  
  5. input[type="checkbox"]:checked + label[for="filterel128cad5a-5d2e-4f82-ba18-22e6d5009679belyj"]{
  6. content: "";
  7. font-size: 0px;
  8. display: inline-block;
  9. height: 15px;
  10. margin:0;
  11. padding:0;
  12. width: 15px;
  13. border:1px #000 solid;
  14. background: #FFF;
  15. box-shadow:2px 2px 1px black;
  16. }
  17.  
  18. input[type="checkbox"] + label[for="filterel128cad5a-5d2e-4f82-ba18-22e6d5009679belyj"]{
  19. content: "";
  20. display: inline-block;
  21. height: 15px;
  22. width: 15px;
  23. border:1px #000 solid;
  24. border-radius:10px;
  25. font-size: 0px;
  26. background: #FFF;
  27. }
не забывайте что каждому чекбоксу присвоен id ( filterel128cad5a-5d2e-4f82-ba18-22e6d5009679belyj ) в Вашем случае цвет вот его и надо смотреть через firebug 
 
post-1991-0-49711700-1383378596_thumb.jp
 
если вместо цвета нужно поставить изображение то при небольших познаниях css  можно сделать вместо
  1.  
  2. background: #FFF;
  1.  
  2. background:url(images/изображенице.пнг);
вот кстати сайт Артура который реализовал цвета в фильтре

Прикрепленные изображения

  • 234.jpg

Сообщение отредактировал SmetDenis: 05 November 2013 - 07:24

  • 2

#5 xatberg

xatberg

Отправлено 02 November 2013 - 14:29

про изображения то забыл, спешил отлучится надо было

если нужно что бы картинки индексировались в поисковых системах то закидывайте в папку /images

если нет то другую директорию какая нужна просто путь до картинки будет другой типа

  1. background:url("../raz/dva/tri/colnishko_gori/изображенице.пнг");

как бы правильно наверно будет (если много изображений) объеденить в css спрайт, ну это если интересно можно в почитать в интернете


  • 0





Темы с аналогичным тегами фильтр

Click to return to top of page in style!