Функция выбора фона на сайте uCoz
 | |
| Тут вы согласитесь, что основном на всех сайтах или блогах стоит один фон по умолчанию. А если сделать так и дать право выбора пользователю, какой фонему нравиться и он может его выставить и тот будет постоянно стоять, пока он не поменяет на другой. Здесь хочется сказать, что этот скрипт подойдет для сайта, который фиксирован по своей ширине и у него есть большое пространства для фона. Когда вы уже поставили и автоматически cookie запоминает ваш выбор. Это для того, чтоб если вы вышли и опять зашли, вам не приходилось обратно устанавливать. Установка: Нужно скачать архив и залить его на сайт в корень его в папку background там и будут изображение, которые вы можете поменять, так как у каждого свои вкусы и тематика тоже диктует свои правила. Теперь ищем место, где будет стоять кнопка и ставим там скрипт. Код <script src="/background/cookie.js"></script> <div class="ff_fon"> <a href="#" class="drox"><img alt="fon" title="Сменить фон сайта" src="/background/ico_panel.png"></a> <div class="ff_cell_ff"> <span class="ff_ugol_ff"></span> <div class="ff_content_en"> <a href="#"><img id="jp1" src="/background/1.jpg" width="20px" /></a> <a href="#"><img id="jp2" src="/background/2.jpg" width="20px" /></a> <a href="#"><img id="jp3" src="/background/3.jpg" width="20px" /></a> <a href="#"><img id="jp4" src="/background/4.jpg" width="20px" /></a> <a href="#"><img id="jp5" src="/background/5.jpg" width="20px" /></a> <a href="#"><img id="jp6" src="/background/6.jpg" width="20px" /></a> <a href="#"><img id="jp7" src="/background/7.jpg" width="20px" /></a> <a href="#"><img id="jp8" src="/background/8.jpg" width="20px" /></a> <a href="#"><img id="jp9" src="/background/9.jpg" width="20px" /></a> </div> </div> </div> <script src="/background/cok.js"></script> И остаются прописать стили CSS: Код .ff_fon { float:right; display:block; position:relative; } .ff_fon .drox { padding: 0px 7px; } .ff_cell_ff, .ff_ugol_ff { width:35px; } .ff_cell_ff { left:-999em; z-index:998; position:absolute; margin: 0 -2px 0 auto; } .ff_content_en { margin:0; width:35px; text-align:center; overflow:hidden; background:#333; } .ff_content_en a:link, .ff_content_en a:visited { float:left; width:35px; padding: 5px 0px 3px 0px; border-bottom: 1px solid #888; } .ff_content_en a:hover { background:#5f5f5f; } .no_bb:link, .no_bb:visited { border-bottom:none!important; } .ff_fon:hover .ff_cell_ff{ top:27px; right:0; left:auto; } .ff_ugol_ff { height:7px; top: -7px; position:absolute; background:url(/fon/ugolok.png) no-repeat center bottom; } Сами стили можно установить в низу, в самом подвале его. Источник: Yraaa.ru | |
Поделиться в социальных сетях
Материал разместил
| Комментарии: 3 | |
|
| |
