Хаки и Скрипты Next Generation CMS
irbees2008 irbees2008 Опубликовано - 28 - августа Кнопки и иконки
2721 - 0
  • Адаптировал: irbees2008
  • Источник:
  • Уровень сложности исполнения: нужны навыки css html
  • Демо:

Побродив по просторам зарубежного инета нашел довольно интересную реализацию radio кнопки.Они сделаны выпадающим списком с привязкой к каждой кнопке изображения ,ну как применить это вам решать,ну а я расскажу как установить на наш шаблон.
Приступим.
1.Скачиваем архив Вы не можете скачивать файлы с нашего сайта ,рекомендуем Вам зарегистрироваться либо войти на сайт под своим именем. ,распаковываем и заливаем в папку с нашим шаблоном.(Если есть в папке файлы с такими именами то переименуйте и в путях не забудьте прописать новые имена.)
2.В хеад подключаем стиль

Код:
<link href="{{ tpl_url }}styles/styles.css" rel="stylesheet" type="text/css" />
3.Там где будут наши кнопки ставим этот код
Код:
<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>
3.Перед закрытием body добавляем скрипты
Код:
<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>
4.Ну готово,пользуемся пишем комменты.

Можешь почитать и вот эту статейку "Тег hr /"

Опрос

Ваше мнение

TWIG -что это?
Результаты

Последние комментарии

Теги

Anything in here will be replaced on browsers that support the canvas element

Статистика

  • Caйту: 3317 дней
  • Новостей: 542
  • Комменты: 254
  • Зарегистрированно : 570
  • Онлайн всего: [7]
  • Гости: [7]
  • Были сегодня : [2] Яндекс, Google
  • SQL запросов: 32
  • Генерация страницы: 0.183сек
  • Потребление памяти: 4.939 Mb 
  •   яндекс.ћетрика