jQuery フローティング広告実装 code_jquery-jsチュートリアル-php.cn

実装方法:

コードをコピーコードは次のとおりです:

フローティング広告
jquery- 1.2.6.js" type="text/javascript">

QQ オンラインサービス
/div>

QQfsdf オンラインサービス
🎜>

jquery ベースのフローティング広告制御コード

最近 jquery に触れて少し勉強しました。上司のニーズを満たすために、を作成しました。画面に対して静的なフローティングレイヤーです。将来使用する必要がある場合に備えて、ここにコードを記録しました。

以下は、jquery コードです。実行するには、jquery クラスライブラリのサポートが必要です。この記事を書いた人は、jquery のバージョンが 1.3.2 でした。他のバージョンが完全に動作するという保証はありません。理解できない場合は、基本的な内容を補足する必要があります。 JavaScript と jquery の知識。これを書いたときはあまり知らなかったので、それほど多くはありません。

$(document).ready(function(){
$ (window)。 scroll( function() { //この関数はブラウザのスクロールバーを監視できます。スクロールバーが移動するとすぐに、この関数はトリガーします
var diffY = $(window).scrollTop(); //ページは現在スクロールバーの位置と上部の間の距離 [scrollTop()]
var diffH = $(window).height()/4;//フローティングバーとブラウザーの上部の間の距離。デザイナーの [height()] は、ブラウザの上部からページの 1/4 の高さを維持するためです。 diffH の値が 0 に設定されている場合、フローティングバーは画面の上部に表示されます。 🎜>varpercent=diffY diffH; //パーセントはフローティングバーの新しい高さの値としてCSSの「top」属性に割り当てられます
if(percentpercent=Math .ceil(percent);
}else{ percent=Math.floor(パーセント); //丸め
var v = パーセント "px"; //CSS 属性には単位が必要です、ここでは px です
$("#adright").css("top",v);//パーセントが top 属性に割り当てられ、ブラウザはこの値に基づいてフローティングバーの高さを動的に調整します。この高さはフローティングバーを画面の中央に維持するだけです。}
});

///////////////////// ////////////// //////// JS と HTML の境界線/////////////////////// //////////// /////////////////////////////////////

以下は HTML コードですphp、jsp、asp などの動的ページにこの部分を配置するだけで問題ありません。画像を配置したい場合は、ページの最後に配置します。、テキスト、フラッシュを、

XXXX

の XXXX 位置に配置するだけです。ページの左側に配置したい場合は、right:25px を left:25px; に変更します。

script ホーム< /a>