Главная » Файлы » Скрипты для uCoz » Переключатели страниц |
Новый интересный переключатель страниц на css3 и jQuery для Каталога Файлов by Apocalypse для uCoz
24.06.14, 14:21:14 | |
Скрипт разработан по мотивам идеи nick1594 Временное ДЕМО Данный переключатель - это просто полёт фантазии и небольшой подарок к Новогодним праздникам. Основным достоинством данного скрипта является его простота и надёжность работы. Особенно полезная функция - возможность разворачивания полного списка страниц и возвращение к компактному виду в один клик Установка: На страницах Каталога файлов, где есть переключатели, замените $PAGE_SELECTOR$ на: Код <style> .aponewselect { white-space:normal; width:500px; } .swchItem, .swchItemA, .swchItemDots { padding:1px 3px 1px 3px; margin-right:3px; margin-bottom:2px !important; background:rgba(220, 220, 220, 0.8); border-top:1px solid #aaa; border-left:1px solid #aaa; border-right:1px solid #eee; border-bottom:1px solid #eee; border-radius:2px; min-width:20px; height:15px; text-align:center; cursor:pointer; transition: border .3s linear, background .2s linear; -moz-transition: border .3s linear, background .2s linear; -webkit-transition: border .3s linear, background .2s linear; -o-transition: border .3s linear, background .2s linear; text-decoration:none !important; color:#777 !important; float:left; } .swchItemA, .swchItemDots { background:rgba(240, 220, 220, 0.8); } .swchItem:hover { border-bottom:1px solid #999; border-right:1px solid #999; border-top:1px solid #eee; border-left:1px solid #eee; background:rgba(220, 245, 220, 0.8); } .swchItem:active { border-bottom:1px solid #ddd; border-right:1px solid #ddd; border-top:1px solid #eee; border-left:1px solid #eee; background:rgba(220, 240, 220, 0.8); } </style> <div class="aponewselect">$PAGE_SELECTOR$</div> <script> // ApoTeam (c) 2013 $('div.aponewselect').prepend('<a class="swchItem" href="javascript://" onclick="$(\'a#aposwitchnew\').remove();$(\'span.swchItemDots\').show();return false;">×</a>'); $('span.swchItemDots').click(function() { var apothisprev = parseInt($(this).prev().text()) + 1; var apothisnext = parseInt($(this).next().text()); for(i=apothisprev;i<apothisnext;i++) { $(this).before('<a class="swchItem" id="aposwitchnew" style="display:none;" href="javascript://" rel="nofollow" onclick="spages(' + i + ');return false;">' + i + '</a>'); } $(this).hide(); $('a.swchItem').fadeIn(); }); // apo-ucoz.com (c) 2013 </script> Материал разработан Apocalypse | |
Просмотров: 523 | Загрузок: 0 | |
Всего комментариев: 0 | |
| |