¤³¤ì¤Ç¤¢¤ì¤Ð¥Õ¥é¥Ã¥·¥å¤ò»È¤ï¤º¤ËAjax¤Î¤ß¤Ç²èÁü¤Î¥Õ¥§¡¼¥É¥¤¥ó¡¢¥Õ¥§¡¼¥É¥¢¥¦¥È¤ò¤µ¤»¤ë¤³¤È¤¬¤Ç¤¤ë
¤Þ¤¿¥Õ¥§¡¼¥É¥¤¥ó¡¢¥Õ¥§¡¼¥É¥¢¥¦¥È¤Ç²èÁü¤¬¾Ã¤¨¤¿¤ê½Ð¤Æ¤¤¿¤ê¤¹¤ë»þ´Ö¤ò¸ÄÊ̤ËÄ´À°¤Ç¤¤ë¡£
widget fader¡¡¥µ¥ó¥×¥ë
http://web-directors.net/sample/fader/samplefader.html
¥µ¥ó¥×¥ë¤ÎHTML¥½¡¼¥¹¤ò²òÀâ
http://web-directors.net/sample/fader/samplefader.html
¥µ¥ó¥×¥ë¤ÎHTML¥½¡¼¥¹¤Ï¡¢²¼µ¤Î¤è¤¦¤Ê¥½¡¼¥¹¥³¡¼¥É¤Ë¤Ê¤Ã¤Æ¤¤¤ë¤Î¤Ç²¼¤Î²òÀâ¤ò¤ß¤Ä¤ÄÍøÍѤ·¤Æ¤¯¤À¤µ¤¤
¡¼¡¼¡¼¡¼¡¼¡¼¡¼¡¼¡¼¡¼¡¼¡¼¡¼¡¼¡¼¡¼¡¼¡¼¡¼¡¼¡¼¡¼¡¼¡¼
¡Öprototype.js¡×¡Öeffects.js¡×¡Öfader.js¡×Æɤ߹þ¤ß
¤ò¤ª¤³¤Ê¤¦ ¤³¤Î£³¤Ä¤Î¥Õ¥¡¥¤¥ë¤¬²èÁü¤Î¥Õ¥§¡¼¥É¥¤¥ó¡¢¥Õ¥§¡¼¥É¥¢¥¦¥È¤Î½èÍý¤ò¤·¤Æ¤¯¤ì¤Æ¤¤¤ë
<script src='js/prototype.js'></script>
<script src='js/effects.js'></script>
<script src='js/fader.js'></script>
<script>
Event.observe(window, "load", function() {
//Images Array used in all demos
var images = [
¢¢ÀÚ¤êÂؤ¨É½¼¨¤·¤¿¤¤²èÁü¤ò½çÈ֤˵ºÜ¤·¤Æ¤¤¤¯
"images/fader/GN023_L.jpg",
"images/fader/GN028_L.jpg",
"images/fader/GN032_L.jpg",
"images/fader/GN037_L.jpg",
"images/fader/GN043_L.jpg"
];
//Default fader
¤³¤Á¤é¤Înew Widget.Fader¡Ê¡Ë¤ÎºÇ½é¤Î¥Ñ¥é¥á¡¼¥¿¡¼¡ÖdefaultDemo¡×¤¬<body>°Ê²¼¤ËµºÜ¤µ¤ì¤ë¥Õ¥§¡¼¥É¥¤¥ó¡¢¥Õ¥§¡¼¥É¥¢¥¦¥È¤Î½èÍý¤ò¤µ¤»¤¿¤¤²èÁü¤Î<img>¥¿¥°¤Îid̾¤Ë¤Ê¤ê¤Þ¤¹
new Widget.Fader("defaultDemo", images);
//Fader with options
new Widget.Fader("optionsDemo", images, {
fadeInDuration: 0.6,
<!-- ¥Õ¥§¡¼¥É¥¤¥ó¤Î½èÍý¤Ë¤«¤«¤ë»þ´Ö¤òÀßÄꤹ¤ë¡¡¾åµ¤Î¾ì¹ç¡¡0.6Éà -->
fadeOutDuration: 0.3,
<!-- ¥Õ¥§¡¼¥É¥¢¥¦¥È¤Î½èÍý¤Ë¤«¤«¤ë»þ´Ö¤òÀßÄꤹ¤ë¡¡¡¡¾åµ¤Î¾ì¹ç¡¡0.3Éà -->
displayDuration: 0.3¡¡
<!-- ²èÁü¤¬É½¼¨¤µ¤Æ¤¤¤ë»þ´Ö¤òÀßÄꤹ¤ë¡¡¾åµ¤Î¾ì¹ç¡¡0.3Éà -->
});
});
</script>
</head>
<body>
¢¤Ï¤¸¤á¤Ë¤Ç¤Æ¤¯¤ë¥Ç¥Õ¥©¥ë¥È¤Î²èÁü¤ò¤¤¤ì¤Æ¤ª¤¯
¤³¤Î¾ì¹ç¡ÖGN023_L.jpg¡×¤Ë¤Ê¤ë¡£
¤Þ¤¿¡¢¡Öid='defaultDemo'¡×¤Ï
¡Önew Widget.Fader("defaultDemo", ¡×¤Ç¤Ä¤±¤¿¡Önew Widget.Fader¡×¤Î¥Ñ¥é¥á¡¼¥¿¡¼¤¬Æþ¤ê¤Þ¤¹¡£
-->
<img id='defaultDemo' src='images/fader/GN023_L.jpg' />
¡Á
¡Á
¡Á
¡¼¡¼¡¼¡¼¡¼¡¼¡¼¡¼¡¼¡¼¡¼¡¼¡¼¡¼¡¼¡¼¡¼¡¼¡¼¡¼¡¼¡¼¡¼¡¼
Ëܲȥµ¥¤¥È¤Ï¤³¤Á¤é¢
http://www.eternal.co.za/scripts/fader/
¥Ú¡¼¥¸¤Î°ìÈÖ²¼¤Ëdownload¤¬¤¢¤ë¤Î¤Ç¡¢¤½¤Á¤é¤«¤é¥¹¥¯¥ê¥×¥È¤ò¼èÆÀ¤·¤ÆÍøÍѤ·¤Æ¤¯¤À¤µ¤¤¡£
¥À¥¦¥ó¥í¡¼¥É¤¹¤ë¤È¡¢¤¤¤í¤¤¤í¥Õ¥¡¥¤¥ë¤¬¤Ï¤¤¤Ã¤Æ¤¤Þ¤¹¤¬¡¢¤½¤ÎÃ椫¤é¡Öjs¡×¥Õ¥©¥ë¥À¤ò³«¤¯¤È
¤ÇÍøÍѤ¹¤ë¡¢¡Öprototype.js¡×¡Öeffects.js¡×¡Öfader.js¡×¤¬¤Ï¤¤¤Ã¤Æ¤¤¤Þ¤¹¤Î¤Ç¤½¤Á¤é¤ò¥ê¥ó¥¯¤µ¤»¤Æ¤¯¤À¤µ¤¤¡£
¾å¤Î¥³¡¼¥É¤ò¼ÂºÝ¤Ëɽ¼¨¤·¤Æ¤ß¤¿¥µ¥ó¥×¥ë
http://web-directors.net/sample/fader/samplefader.html
¤ÈƱ¤¸¤è¤¦¤Ëºî¤ë¾ì¹ç¤Ï¡Öprototype.js¡×¡Öeffects.js¡×¡Öfader.js¡×°Ê³°¤Îjs¥Õ¥¡¥¤¥ë¤ÏɬÍפ¢¤ê¤Þ¤»¤ó