擬似アジャックス

- ブログからのクロスポスト

Web 2.0は、Webサイトを作成したい人々の心に入り始めました。 特別なケースとして、一部の人々は単にAjaxテクノロジーに夢中になっています。 彼らはどこでもそれを使用することを要求します。 当然、顧客を納得させることはできますが、これが不可能または場違いな場合は、「疑似Ajax」と呼ばれるトリックを使用できます。



最初に、ほとんどの顧客がAjaxがページで作業していると判断する方法を見つけましょう。

実際、2つのポイントのみが明確に明らかになっています。これは、ページをリロードせずに情報を操作し(アドレスバーを見る)、回転する画像、別名ローダーです。 www.ajaxload.infoでローダーを生成したい

擬似アジャックス

2番目の瞬間の特殊なケースを考えてみましょう。 これは、ページに大きな写真をダウンロードするか、多数の画像をロードすることです。 当然、Ajaxはここではまったく必要ありませんが、顧客がそこに表示したい場合は表示します。

これには何が必要ですか? 実際にはそれほどではありません。 サイズが明確に定義された画像とローダーのGIF。 段階的に見てみましょう。



imgタグを使用して、高さ、幅を示しますが、画像のアドレスは指定しないでください。 次のようになります(例としてFF3を使用しますが、必要なすべてのブラウザーでほとんど同じように見えます)。

擬似アジャックス

次に、画像にimgタグのアドレスを指定します。これは、適切なサイズの透明なgifです。 バックグラウンドにローダーを置きます。 次のようになります: http : //absolvo.ru/tmp/9/index-2.html



さて、透明なgifを必要な画像に置き換えます。 ここで見ることができます: http : //absolvo.ru/tmp/9/

当然、画像が読み込まれているので、太いチャンネルでは目を瞬く時間がないことを考慮する価値があります。 ただし、写真(ギャラリーまたは商品のリスト)が多数ある場合は、厚いチャンネルでもすべてが表示されます:)



コードは次のようになります。

"Img src =" absolvo.gif "width =" 120 "height =" 120 "style =" border:1px solid#e5e5e5; background:url(ajax-loader.gif)center no-repeat; "/"

もう一度リンクを繰り返します。



http://absolvo.ru/tmp/9/-デモンストレーション;

http://absolvo.ru/tmp/9/index-2.html-画像として透明なgifを使用したデモ。

www.ajaxload.info-発電機ローダー。



さて、準決勝へのアクセス、紳士:)



All Articles