Все для web-мастеров и создания сайта. » DataLife Engine » Хак - DataLife Engine » Хак кнопка в верх на Dle в 3х цветах

Хак кнопка в верх на Dle в 3х цветах

  • Новость
  • Похожие новости
Admin в 21час. 12мин. пишет:
Хак кнопка в верх на Dle в 3х цветах
Хак кнопка в верх на Dle в 3х цветах
Хак кнопка в верх на Dle в 3х цветах


Кнопка работает на всех сайтах где подключен jquery , так же работает и на dle.

Версия DLE: Все версии 9.х.

Установка:
в style.css добавляем:
#gotop{position:fixed;width:41px;height:41px;right:7px;bottom:20px;display:block;background:url('../images/gotop.png') no-repeat;z-index:9998;display:none;}


В любой ваш скрипт которые подключен в самый низ добавляем:
$(function(){
    var scroll_start = 120;
    var top = 0;
    $('body').append('<a href="#" id="gotop" title="Наверх &uarr;"></a>');
    var s = $('#gotop');
    var margin_top = parseInt(s.css('top'));
    function gotop_scroll(){
        top = $(window).scrollTop();
        if(top < scroll_start) s.fadeOut(400);
        else s.fadeIn(300,function(){$(this).css('opacity',0.5)});
    }
    $(window).scroll(gotop_scroll);
    s.live({
        mouseenter:function(){if(top>scroll_start) $(this).fadeTo(200,1.0);},
        mouseleave:function(){if(top>scroll_start) $(this).fadeTo(400,0.5);},
        click:function(){$('html,body').animate({scrollTop:0},'slow');return false;}
    });
})

var scroll_start = 120; - данный параметр отвечает сколько пикселей нужно прокрутить что бы появилась кнопка.
if(top < scroll_start) s.fadeOut(400); - скорость прокрутки.
else s.fadeIn(300,function(){$(this).css('opacity',0.5)}); - уровень прозрачности кнопки.

Кнопку кидаем в /templates/{THEME}/images/gotop.png

Новый вид topnews

Новый вид topnews


Новый вид вывода популярных новостей с небольшим пред просмотром для Dle.

Меню выезжающее с боку с под категориями

Меню выезжающее с боку с под категориями


Компонент боковое выезжающее меню с под категориями для InstantCMS.


Скользящее анимированное меню на JQuery

Скользящее анимированное меню на JQuery


Это простой урок, в котором будет представлено раздвигающееся анимированное меню на JQuery с несколькими интересными эффектами.
Приступим к нашему коду.


Увеличение картинки при наведении курсора

Увеличение картинки при наведении курсора


Как можно сделать интересный эффект увеличения картинки при наведении на него курсора.


CSS » jQuery » Урок jQuery 4 - Автопрокрутка страницы

 CSS » jQuery » Урок jQuery 4 - Автопрокрутка страницы


Приветствую всех постоянных читателей и гостей на сайте "Всё для вебмастеров и создания сайта". В этой небольшой и достаточно простой статье, я
расскажу вам о создании плавной автоматической прокрутки вверх (полезно для длинных сайтов), реализованной с помощью CSS и jQuery.

Кстати, работу именно этого плагина можно наблюдать на страницах нашего сайта.

Просмотров: 364Дата: 08.12.12
  • Комментарии
  • Вконтакте
  • FaceBook

Какая у вас CMS ?

Datalife Engine
Joomla
Ucoz
Drupal
Wordpress
Другая