[dojo] Smooth Scrolling “Go To Top” Link

滑らかにスクロールするトップに戻るボタンのDojo版。
DavidのソースにSmoothScrolllつけてみたよ。

DojoのSmoothScrollはDojox内にあるのでfxとfx.scrollをrequireする必要があります。
クリックしたときにstopEventするとアンカーがURLに反映されなくなる。これはMooToolsとかでも同じですな。

(function(d,$) {
	d.require('dojox.fx');
	d.require("dojox.fx.scroll");
	
	d.addOnLoad(function() {

		var topLink = $('gototop');
		d.style(topLink,{
			'opacity': 0,
			'visibility': 'visible',
			'display':'block'
		});
		
		d.connect(topLink,'onclick',function(e){
			d.stopEvent(e); 
			dojox.fx.smoothScroll({'node':d.body(),'win':window,'duration':300}).play();
		 });
		
		d.connect(window,'onscroll',function(e) {
			var scrollY = -d.position(d.body()).y, thresh = 100;
			/*  d['fade' + (scrollY > thresh ? 'In' : 'Out')]({ node: topLink }).play(); */ 
			d.anim(topLink, { 'opacity': (scrollY > thresh ? 1 : 0 ) });/* more concise, @phiggins */ 
			
		});
	});
})(dojo,dojo.byId);

コメントを残す

このサイトはスパムを低減するために Akismet を使っています。コメントデータの処理方法の詳細はこちらをご覧ください