JavaScript

[javascript]jQueryPlugin:dropdown

サンプル

 

参考にしたサイト

Solution For Very Long Dropdown Menus | CSS-Tricks

http://css-tricks.com/long-dropdowns-solution/

 

[javascript]jQueryPlugin:prettyPhoto メディアビューワー lightboxクローン

サンプル
This is the title

Red round shapeRed round shapeRed round shapeRed round shape

スライドショー自動再生

Red round shapeRed round shapeRed round shapeRed round shape

Flash 10 demo

YouTube

Vimeo

Google.com(iframe)
Apple.com(iframe)

inline

Red round shapeRed round shapeFlash 10 demo YouTube inline

参考にしたサイト

jQuery lightbox for images, videos, YouTube, iframes | Stephane Caron ? No Margin For Errors
http://www.no-margin-for-errors.com/projects/prettyphoto-jquery-lightbox-clone/

[javascript]jQueryPlugin:fancybox ビューワー

サンプル
 

基本

 
グルーピング マウスホイールでも


 
説明文位置調整

 
テキスト1 テキスト2
 
swf
 

ペンギン (英語: penguin) は、鳥類ペンギン目(学名 Sphenisciformes)に属する種の総称である。ペンギン科(学名 Spheniscidae)のみが現生する。
南半球の広い緯度範囲に分布する。主に南極大陸で繁殖するのはコウテイペンギンとアデリーペンギンの2種のみである。ほかに、ジェンツーペンギン・マカロニペンギン・ヒゲペンギンの3種は、南極大陸の中でも比較的温暖な南極半島にも繁殖地があるが、主な繁殖地は南極周辺の島である。他の種類は南アメリカ・アフリカ南部・オーストラリア・ニュージーランド、あるいは南極周辺の島などに繁殖地がある。
ペンギン (英語: penguin) は、鳥類ペンギン目(学名 Sphenisciformes)に属する種の総称である。
ペンギン科(学名 Spheniscidae)のみが現生する。
Close


参考にしたサイト

Fancybox – Fancy lightbox alternative
http://fancybox.net/
 

[javascript]jQueryPlugin:lightbox ビューワー

サンプル



参考にしたサイト

jQuery lightBox plugin
http://leandrovieira.com/projects/jquery/lightbox/
 

[javascript]jQueryPlugin:ScrollToにFlashのTweenクラスを移植

移植しました。
前に似たようなのを作った気がしますが、今回はjQueryです。
 
サンプル
/blog/childpage/jquery/03/index.html
 
移植していない普通のScrollToの使い方はこちら
plugin:ScrollTo 指定エレメントまでスクロールする
 

javascript

$(document).ready(init);
function init(){
	$.easing.easeNone=function(x, t, b, c, d) {
		return c * t / d + b;
	};

	$.easing.RegularEaseOut=function(x, t,b,c,d){
		return -c * (t /= d) * (t - 2) + b;
	};
	$.easing.RegularEaseIn=function(x, t,b,c,d){
		return c * (t /= d) * t + b;
	};
	$.easing.RegularEaseInOut=function(x, t,b,c,d){
		if((t /= d / 2) < 1)return c / 2 * t * t + b;
		return -c / 2 * ((--t) * (t - 2) - 1) + b;
	};

	$.easing.StrongEaseOut=function(x, t,b,c,d){
		return c * ((t = t / d - 1) * t * t * t * t + 1) + b;
	};
	$.easing.StrongEaseIn=function(x, t,b,c,d){
		return c * (t /= d) * t * t * t * t + b;
	};
	$.easing.StrongEaseInOut=function(x, t,b,c,d){
		if((t /= d / 2) < 1)return c / 2 * t * t * t * t * t + b;
		return c / 2 * ((t -= 2) * t * t * t * t + 2) + b;
	};

	$.easing.ElasticEaseOut=function(x, t,b,c,d){
		if(t == 0)return b;
		if((t /= d) == 1)return b + c;
		var p = d * 0.3;
		var a=c;
		var s = p / 4;
		return a * Math.pow(2, -10 * t) *Math.sin((t * d - s) * (2 * Math.PI) / p) + c + b;
	};
	$.easing.ElasticEaseIn=function(x, t,b,c,d){
		if(t==0)return b;
		if((t /= d) == 1)return b + c;
		var p=d * 0.3;
		var a=c;
		var s=p/4;
		return -(a * Math.pow(2, 10 * (t -= 1)) *Math.sin((t * d - s) * (2 * Math.PI) / p)) + b;
	};
	$.easing.ElasticEaseInOut=function(x, t,b,c,d){
		if (t == 0)return b;
		if ((t /= d / 2) == 2)return b + c;
		var p = d * (0.3 * 1.5);
		var a=c;
		var s=p/4;
		if (t < 1)return -0.5 * (a * Math.pow(2, 10 * (t -= 1)) *Math.sin((t * d - s) * (2 * Math.PI) /p)) + b;
		return a * Math.pow(2, -10 * (t -= 1)) *Math.sin((t * d - s) * (2 * Math.PI) / p ) * 0.5 + c + b;
	};

	$.easing.BounceEaseOut=function(x, t,b,c,d){
		if ((t /= d) < (1 / 2.75)){
			return c * (7.5625 * t * t) + b;
		}else if (t < (2 / 2.75)){
			return c * (7.5625 * (t -= (1.5 / 2.75)) * t + 0.75) + b;
		}else if (t < (2.5 / 2.75)){
			return c * (7.5625 * (t -= (2.25 / 2.75)) * t + 0.9375) + b;
		}else{
			return c * (7.5625 * (t -= (2.625 / 2.75)) * t + 0.984375) + b;
		}
	};
	$.easing.BounceEaseIn=function(x, t,b,c,d){
		return c - $.easing.BounceEaseOut(x,d - t, 0, c, d) + b;
	};
	$.easing.BounceEaseInOut=function(x, t,b,c,d){
		if (t < d/2){
			return $.easing.BounceEaseIn(x,t * 2, 0, c, d) * 0.5 + b;
		}else{
			return $.easing.BounceEaseOut(x,t * 2 - d, 0, c, d) * 0.5 + c * 0.5 + b;
		}
	};

	$.easing.BackEaseOut=function(x, t,b,c,d){
		var s = 1.70158;
		return c * ((t = t / d - 1) * t * ((s + 1) * t + s) + 1) + b;
	};
	$.easing.BackEaseIn=function(x, t,b,c,d){
		var s = 1.70158;
		return c * (t /= d) * t * ((s + 1) * t - s) + b;
	};
	$.easing.BackEaseInOut=function(x, t,b,c,d){
		var s = 1.70158;
		if ((t /= d / 2) < 1)return c / 2 * (t * t * (((s *= (1.525)) + 1) * t - s)) + b;
		return c / 2 * ((t -= 2) * t * (((s *= (1.525)) + 1) * t + s) + 2) + b;
	};

	$('div#main a').click(when_a_release);
	$.scrollTo('#top', 0);
}
function when_a_release(){
	$.scrollTo(this.hash, 800, {easing:this.innerHTML.split(" ").pop()});
	return false;
}

 
参考にしたサイト
 
Ariel Flesler: jQuery.ScrollTo
http://flesler.blogspot.com/2007/10/jqueryscrollto.html
 
ScrollTo | jQuery Plugins
http://plugins.jquery.com/project/ScrollTo