3359
- 0
Побродив по просторам зарубежного инета нашел довольно интересную реализацию radio кнопки.Они сделаны выпадающим списком с привязкой к каждой кнопке изображения ,ну как применить это вам решать,ну а я расскажу как установить на наш шаблон.
Приступим.
1.Скачиваем архив Вы не можете скачивать файлы с нашего сайта ,рекомендуем Вам зарегистрироваться либо войти на сайт под своим именем.
,распаковываем и заливаем в папку с нашим шаблоном.(Если есть в папке файлы с такими именами то переименуйте и в путях не забудьте прописать новые имена.)
2.В хеад подключаем стиль
Код:
<link href="{{ tpl_url }}styles/styles.css" rel="stylesheet" type="text/css" />Код:
<div class="container">
<div class="filter-wrapper">
<div class="image-filters">
<input id="filter-1" type="radio" name="radio-set"><label for="filter-1">Cityscape</label>
<input id="filter-2" type="radio" name="radio-set"><label for="filter-2">VW Bus</label>
<input id="filter-3" type="radio" name="radio-set"><label for="filter-3">Cactus</label>
</div>
</div>
</div>
Код:
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script src="{{ tpl_url }}js/main.js"></script>
<script>
$( function() {
$('.image-filters').customradio({
mobileImages: true,
imgsUrl: 'imgs/'
});
});
</script>
Можешь почитать и вот эту статейку "Основы отзывчивого веб-дизайна"
Это тоже интересно
31.08.14Стильные CSS3 hover эффекты
27.11.13FerroMenu JQuery плагин
Мы рекомендуем Вам зарегистрироваться либо войти на сайт под своим именем.