| Главная » Статьи » Скрипты » Скрипты для uCoz |
Скрипт сворачивания / разворачивания блоков
Code <script type="text/javascript" src="jquery.js"></script> <script type="text/javascript"> $(document).ready(function(){ $(".btn-slide").click(function(){ $("#panel").slideToggle("slow"); $(this).toggleClass("active"); return false; }); }); </script> <style type="text/css"> body { margin: 0 auto; padding: 0; width: 100%px; font: 75%/120% Arial, Helvetica, sans-serif; } a:focus { outline: none; } #panel { background: #ffffff; height: 400px; display: none; } .slide { margin: 0; padding: 0; border-top: solid 2px #00c0ff; background: url(http://vsebudetok.net/images/block/button_blu180_30_pok.gif) no-repeat center top; } .btn-slide { background: url(http://vsebudetok.net/images/block/button_blu180_30_skr.gif) no-repeat right -40px; text-align: center; width: 180px; height: 30px; padding: 0px 0px 0 0; margin: 0 auto; display: block; font: bold 120%/100% Arial, Helvetica, sans-serif; color: #ffffff; text-decoration: none; } .active { background-position: right 0px; } </style> </head> <body> <div id="panel"> <!-- здесь ваш Block --> ляляляляляляля </div> <p class="slide"><a href="#" class="btn-slide"></a><!-- здесь можете написать подпись для кнопки, если не хотите использовать кнопки в виде картинок --></p> Источник: http://webucoz.com/l | |
| Просмотров: 475 | Рейтинг: 0.0/0 |
| Всего комментариев: 0 | |
