懐かしいホームページを再現するjQueryプラグイン web-old-days.js

『しっくす・アパートの部屋』のソースを解析して、最先端のテクノロジーを取り入れてみました。まずは、使われている jQuery プラグインをダウンロードして、サーバにアップロード。

• web-old-days.js

それから以下のCSSを作成。

    
span.rat { 
    position: absolute; 
    width: 16px; 
    height: 16px;
}

span.marquee { 
    position: relative;
    width: 100px; 
}

head 要素内で読み込む。

<script src="http://www.stokeshot.com/javascript/plugins/jquery.web-old-days/web-old-days.js" type="text/javascript" ></script>
<link rel="stylesheet" type="text/css" href="http://www.stokeshot.com/javascript/plugins/jquery.web-old-days/style.css" media="screen" />

あとは、通常のjQuery プラグインと同じく、Domターゲットを指定して実行するだけ！

$(document).ready(function(){

  $.cursorrat({
    path: 'http://campaign.sixapart.jp/aprilfool/images/',
    images: ['toph.png', 'tophtoph.png', 'sixapart.png', 'typepad.png', 'movabletype.png', 'vox.png']
  });

  $.('.marquee').marquee();
  $.('.blink').blink();
    
});  
    

マーキーも自由自在！