Go to top of Page animat cu jQuery

Scris de bogdanmogo la data 23 Octombrie, 2009

Plecand de la scriptul dezvoltat de Ariel Flesler pentru a face smooth scroll pe o pagina, am construit un plugin pentru Wordpress, care sa faca acelasi lucru.

Pluginul poate fi customizat prin intermediul paginii de administrare, unde ii putem schimba interfata .css, dar si viteza de fading sau la ce height minim sa apara.

Instalare

Descarcam arhiva pluginului de aici si plasam fisierele in directorul /wp-contents/plugins/.

In lista de pluginuri vom gasi item-ul “Smooth GoToTop”, care trebuie activat.

plugins_list

Administrare

Pentru adaptarea temei pluginului la blogul tau vom folosi pagina de administrare. Pluginul se va gasi in Settings > Smooth GoToTop.

smoothgototopSelectarea unei teme de culori pentru text si background se poate face prin apasarea label-urilor din dreptul campurilor Text sau Background. Pentru stabilirea pozitiei pe ecran si a distantei fata de margini se folosesc campurile Position si Padding.

Configurarea in modul avansat

Pentru a configura distanta minima dupa care sa apara butonul de GoToTop, deschidem fisierul /jquery.top.js si mergem la linia 32.

................
$(document).ready(function() {
 
                   $('#top-link').topLink({
 
                       min: 400, // inaltimea minima dupa care sa apara butonul de GoToTop
                       fadeSpeed: 500 // viteza de fading
 
                   });
....

Daca dorim sa schimbam dimensiunea fontului sau chiar fontul o putem face modificand cateva linii in fisierul /gototop.php, incepand cu linia 45.

#top-link   {
 
                   display:none;
                   position:fixed;
                   right:5px;
                   bottom:5px;
                   height:18px;
                   color:#000000;
                   font-family: arial;
                   font-size:11px;
                   font-weight:bold;
                   text-decoration:none;
                   background:#90FF00; padding:5px;
 
}

Descarca plugin

Pluginul poate fi vazut aici.

Astept comentarii si bug-uri….

8 răspunsuri la “Go to top of Page animat cu jQuery”

  1. [...] This post was mentioned on Twitter by Loredana Pascal, Mogosanu Bogdan. Mogosanu Bogdan said: Am creat un plugin wordpress pentru Smooth GoToTop of Page … Folositi-=l cu incredere. Astept feedback http://bit.ly/1E8mXn [...]

  2. Dana says:

    mda….interesant, dar sunt bloggeri care nu au terminat automatica.
    eu de ex sunt pe business marketing, economic, financiar…….imi e destul de greu sa inteleg limbajul tau, de fapt, configurarea in mod avansat.
    sa inteleg ca nu e pentru oricine mesajul tau?

  3. rAuLiTo says:

    Nu l-am încercat încă niciodată, dar îl voi instala azi. Nu cred să aibă ceva buguri, după demoul care l-am văzut, e foarte ok.
    E foarte util plugin-ul.

  4. bogdanmogo says:

    @raulito – astept rezultatul instalarii
    @Dana – poate ai citit Configurarea in modul avansat. Citeste despre instalare & administrare.

  5. Iosif says:

    comentez si eu numai sa fie comentat ! sincer ? nu am idee…..sunt super incepator !
    da am o intrebare va rog ! stiti cumva de ce daca vreau sa urc o poza intr-o postare noua sau un video nu ma lasa ? i-mi apare cica : try again !
    asta de vreo 2 saptamani…….
    va rog daca stiti care sa ma ajutati !
    mersi si salutari all !

  6. [...] 7. Smooth GoToTop Wordpress plugin [...]

  7. [...] Plugin para WordPress – fuente Mogosanu.ro. Descarga el plugin e instálalo en tu WordPress. [...]

Lasă un răspuns

Bazele SEO
oprirea pc speaker-ului pe linux