/ ウェブサービス / Webプログラム / JavaScriptのurlに基づいて画像を変更
JavaScriptを

JavaScriptのurlに基づいて画像を変更

JavaScriptを利用して画像を変更する方法です.

ショッピングモールのソリューションでは、特定のカテゴリ時、そのカテゴリを表記するために様々な悩みをして考えた方法です.

ショッピングモールのソリューションの場合、カテゴリを表記する部分のほとんどが一つのページで構成されています.

この一つのページが様々なカテゴリを作成するときに別の方法で見えるようにする必要がありますがこの時使用した.

 

作業を進行したショッピングモールの場合非常に多くのカテゴリがありい特定のカテゴリを選択したときに選択されたカテゴリーを確認できるようにしてほしいというクライアントの要求で作業を進めましたよ.

 

まず、ショッピングモールのurlを見ると、 HTTP://ドメイン/フロント/ PHP / category.php?cate_no = 4 부터 시작 해서 cate_no=600 이 넘게 있었습니다.

 

して、まずcate_no =を調べ、そのcate_no =になったときにどのようなアクションを与えることに決定しました.

 

JavaScriptでそのurlをご覧来る方法で

 

frmUrl = LOCATION.HREF

varCut = frmUrl.indexOf(“?”)
varCheck = frmUrl.substring(varCut + 1)
だっvarListが= varCheck.split(“&”)
forCount = varList.length
ために(I = 0; 私 < forCount; I ++)
{
evalの(varListが[私])

}

 

を使用しています.

 

以降は、urlが正しい場合は、画像を変更するようにアクションを与えるんです. その部分は、以下のように。.

 

window.onload =関数 ()
{
VAR IOC = cate_no;
VAR = PNO IOC;

もし(IOC = PNO) {
document.getElementById(PNO +”_ou”).style.display = “なし”;
document.getElementById(PNO +”_ov”).style.display = “ブロック”;

}
}

 

このように、スクリプトを与えもうカテゴリーのイメージ部分の作業ですが〜

<divのid =”メニュー”>

<HREF =”/フロント/ PHP / category.php?cate_no = 4″><IMGのID =”4_ou” src=”/ウェブ/アップロード/ NFN / wendyrose /メニュー/ w_menu_out_03.jpg” ボーダー=”0″ onMouseOverの=”this.src = '/ウェブ/アップロード/ NFN / wendyrose /メニュー/ w_menu_over_03.jpg'” れるonmouseout =”this.src = '/ウェブ/アップロード/ NFN / wendyrose /メニュー/ w_menu_out_03.jpg'”><IMGのID =”4_ov” スタイル=”表示:なし” src=”/ウェブ/アップロード/ NFN / wendyrose /メニュー/ w_menu_over_03.jpg” ボーダー=”0″></DIV>

 

<divのid =”メニュー”><HREF =”/フロント/ PHP / category.php?cate_no = 5″><IMGのID =”5_ou” src=”/ウェブ/アップロード/ NFN / wendyrose /メニュー/ w_menu_out_03.jpg” ボーダー=”0″ onMouseOverの=”this.src = '/ウェブ/アップロード/ NFN / wendyrose /メニュー/ w_menu_over_03.jpg'” れるonmouseout =”this.src = '/ウェブ/アップロード/ NFN / wendyrose /メニュー/ w_menu_out_03.jpg'”><IMGのID =”5_ov” スタイル=”表示:なし” src=”/ウェブ/アップロード/ NFN / wendyrose /メニュー/ w_menu_over_03.jpg” ボーダー=”0″></DIV>

 

 

このように作業しました.

 

JavaScriptを見れば、そのurlのcate_noをicoに指定ハヨトグヨそしてpncをcate_noと同じように指定しました.

そして、画像が表示される部分に画像を二つを入れて普段はcate_no_ou IDを持つ画像が出力されてcate_noがあるurlでcate_no_ov IDを持つ画像を出力するようにしました。^^

 

上記ソースはカフェ24ショッピングモールソリューションでカテゴリ別に画像を表記する方法ですが. urlを調べるスクリプトを利用すれば、他のショッピングモールやホームページでも十分使用可能なソースです.

 

今までは、そのカテゴリごとに、Javaスクリプルル作成ソースが非常に多かったんですこれは簡単にする方法がないかと考えてみると簡単に数行で解決することになりました。^^

皆さんも一度みてください^^

また、チェック

phpmyadminの 404

nginxのはphpmyadminの 404 見つかりません

ある日突然、nginxサーバーからphpmyadmin 404 Not Foundエラーが発生した場合、その中にサーバーに …

返信を残します

あなたのメールアドレスが公開されることはありません. 必須フィールドは、マークされています *