人力検索はてな
モバイル版を表示しています。PC版はこちら
i-mobile

javascript素人なので詳しく教えて頂きたいと思います。

サイトリニューアルに伴い、以下の仕様に変えたいと思っています。
このスクリプト自体他の人が作ったものなのでよく理解できていません。。


以下ページにある「前の写真へ」「次の写真へ」のボタンをクリックするとサムネイルの枠線が移動し、
且つ、メインの大きい写真が変わるスクリプトを使用しています。

http://www.all-eyefulhomenavi.com/kamimura/urawa/example/0017/index.html

【現在のJavascriptの仕様】
A-E(5つ)の画像が切り替えられる仕様

「次へ」の仕様を実現するために、現在の仕様になっているのだと思いますが、
今の仕様ですと点数をきっちりいれないとエラーになるため、修正をしたいと思っています。


【新仕様】
?画像点数は1?点数制限なしで対応した切り替え記述

?a,b,c,dなど画像に番号をつけるのではなく1,2,3,4で番号をつける。


よろしくお願いします。




●質問者: mune0628
●カテゴリ:ウェブ制作
✍キーワード:JavaScript エラー クリック サイト サムネイル
○ 状態 :キャンセル
└ 回答数 : 2/2件

▽最新の回答へ

1 ● pahoo

?a,b,c,dなど画像に番号をつけるのではなく1,2,3,4で番号をつける。

これについては、change 関数の switch 文の case の中を数字に変更してやれば対応できると思います。


?画像点数は1?点数制限なしで対応した切り替え記述

change 関数の大幅な見直しが必要です。

それと、あらかじめ対象となる画像の数を把握しなければなりません。

たとえば、対象となる img タグに同じIDを付与し、getElementByIdメソッドで数えるという方法が考えられます。

個人的にはサーバサイドで処理した方が早いと思うのですが‥‥。

◎質問者からの返答

>pahooさん

早速のご回答ありがとうございます。

(2)については数字で入れ替える事は試しました。こちらは問題なく動作します。

(1)の点数制限なしで対応する際にどの様な記述をすれば良いか、教えて頂けると幸いです。何か参考になるページはありますか?

サーバーサイドでの処理ではなくあくまでもJavascript内で完結させたいと考えてます。

何かアイデアがあればよろしくお願い致します。


2 ● kou32rr

思い切ってそもそもの画像切替の仕組みを変えてしまっては?

見た目も良くなりますよ。

Lightbox 2.0

http://journal.mycom.co.jp/articles/2007/06/14/lightbox/

jQuery Cycle Plugin (お勧めですが少し難しめ)

http://malsup.com/jquery/cycle/

http://malsup.com/jquery/cycle/pager3.html

http://redline.hippy.jp/lab/misc/jquery_cycle_plugin.php

◎質問者からの返答

ご回答ありがとうございます。

しかし、JavaScriptの記述で処理したいと思いますので。

JSではこの様な実装は難しいのでしょうか?

引き続き、よろしくお願いします。

関連質問


●質問をもっと探す●



0.人力検索はてなトップ
8.このページを友達に紹介
9.このページの先頭へ
対応機種一覧
お問い合わせ
ヘルプ/お知らせ
ログイン
無料ユーザー登録
はてなトップ