Scroll to Top Control, web sayfasında gezinirken sayfayı aşağıya doğru kaydırdığımızda tekrar sayfanın üst kısmına çıkmamızı sağlayan bir kısayoldur. jQuery kullanılarak hazırlanmış olan Scroll to Top Control sayfa hareketsizken gözükmemektedir. Sayfayı aşağı doğru hareket ettirdiğimizde sağ alt köşede üzerinde ok işareti olan resim belirmektedir.
Tabii bu resmi beğenmeyenler aşağıda gösterilen yerden istedikleri bir resm ile değişebilirler.
Bunu blogunuza entegre etmek çok kolay. Eklemek için bir bilgiye sahip olmanız gerekmez. Alttaki adımları takip etmeniz yeterli...
Not: FF1+ IE6+ Opera 7+ ile sorunsuz çalışıyor.
1. Kumanda Paneli--- Yerleşim--HTML'yi Düzenle dedikten sonra ctrl+f ile arama yaparak ]]></b:skin> kodunu bulup, hemen alt satırına alttaki js kodunu eklemeniz yeterli. Şablonu kaydedip baktığınızda uygulamanızın çalıştığını göreceksiniz.
<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js' type='text/javascript'/>
<script src='http://www.sigmirror.com/files/35045_wnhuh/scrolltopcontrol.js' type='text/javascript'> </script>
scrolltopcontrol.js js dosyasını isterseniz kendi host sitenize atabilirsiniz. Böylece ileride de sizin için sorun teşkil etmez.
Eğer resmi değiştirmek isterseniz scrolltopcontrol.js dosyasını indirerek (sağ tıkla/farklı kaydet) aşağıda renkli gösterilen resim adresini kendi resim adresinizle değiştiriniz. Dosyayı açmak için bir programınız yoksa not defteri ilede açabilirsiniz.
var scrolltotop={
//startline: Integer. Number of pixels from top of doc scrollbar is scrolled before showing control
//scrollto: Keyword (Integer, or "Scroll_to_Element_ID"). How far to scroll document up when control is clicked on (0=top).
setting: {startline:100, scrollto: 0, scrollduration:1000, fadeduration:[500, 100]},
controlHTML: '<img src="http://i26.tinypic.com/2ednl6s.png" style="width:48px; height:48px" />', //HTML for control, which is auto wrapped in DIV w/ ID="topcontrol"
controlattrs: {offsetx:5, offsety:5}, //offset of control relative to right/ bottom of window corner
anchorkeyword: '#top', //Enter href value of HTML anchors on the page that should also act as "Scroll Up" links
state: {isvisible:false, shouldvisible:false},
Lütfen Alıntı yaparken kaynak gösterin....
4 yorum:
Hayırlı Günler kardeşim.Dediklerini aynen uyguladım fakat olmadı.Js dosyasını kendime göre düzenledim.Bende 16*16 boyutunda simge varmı resmi o dosyaya ekledim o dosyanın içinde genişlik ve yükseklik ayarlarını da 16*16 yaptım fakat olmadı.Dosyayıda kendi pages sayfama kaydettim.Ama malesef sonuç alamadım.Rica etsem bir deneme blogunda nasıl olduğunu gösterebilir misin ?
Enes blogunda bu eklenti var zaten. Umarım ona eklememissindir. Çünkü çalışmayabilir. Başka bir şablonda denediysen eğer ve çalışmıyorsa birde burdaki kodu aynen ilave et öyle dene. Çünkü ben birkaç şablonda denedinim ve sorunsuz çalışıyor. Bu blogada ekledim. Kolay gelsin.
Şimdi yaptım kardeşim çok sağolasın.Bence her blogun uygulaması gerek.Şık bir uygulama ;)
Bu uygulama benimde çok hoşuma gitti. Bende seninle ayını fikirdeyim. Herkese lazım.
Yorum Gönder