![](http://oshiete.xgoo.jp/images/v2/pc/qa/question_title.png?e8efa67b6d)
画像を条件で抽出して表示させたいのですが、可能でしょうか?
pic1ならtext1、という感じで対になるテキストを用意して、
例えば「川」を表示したければ、
テキストの頭が「川」なら、対になる画像を表示させる、
という方法でいいかなぁと(^_^;)
もっとスマートな方法があれば、
アドバイスお願いします<(_ _)>
pic1.jpg(山の写真)
text1.txt(山、富士山、静岡県、3,776m)
pic2.jpg(川の写真)
text2.txt(川、江戸川、千葉県、59.5km)
pic3.jpg(湖の写真)
text3.txt(湖、琵琶湖、滋賀県、670.33)
・
・
No.1ベストアンサー
- 回答日時:
全体像がわからないので、なんとなくですが…
画像は全てimgで書いておく。テキストはaltやtitileで。
<img src="pic1.jpg" alt="富士山" title="山/静岡県/3,776m">
<img src="pic2.jpg" alt="江戸川" title="川/千葉県/59.5km">
で、スタイルシートで非表示にしておき、
検索処理でaltやtitleにマッチしたもの表示する。
とか思いつきました。
画像が大量にあると読み込みに時間が掛かるのがネックですが、
こうした書き方にしておくとデータで持たせていては不可能なgoogleなどの外部からも検索される事が期待できます。
タイトル通り別データで、という事なら別ファイル(XMLとか)に画像のURLやテキストを用意してAjaxで読み込み/検索するようにするのかなぁ。
全然質問の意図を取り違えているようでしたら失礼。
もう少し具体的に実現したいユーザーインターフェースとか画面構成とかがあると違った答えになったかもしれません。
この回答への補足
画像は後から追加できるのが希望です(^_^)
ツーリングで風景写真を撮って、
サーバーに随時アップしていく、という感じです。
その時、サーバーの画像フォルダに
画像と、それと対になるテキストを放り込むだけで、
例えば「山」ボタンを押すと、
抽出されて表示される... という感じです。
今から本屋に行って、XMLとAjaxの入門書を探してきます(^_^;)
お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!
関連するカテゴリからQ&Aを探す
おすすめ情報
- ・漫画をレンタルでお得に読める!
- ・【あるあるbot連動企画】あるあるbotに投稿したけど採用されなかったあるある募集
- ・【あるあるbot連動企画】フォロワー20万人のアカウントであなたのあるあるを披露してみませんか?
- ・映画のエンドロール観る派?観ない派?
- ・海外旅行から帰ってきたら、まず何を食べる?
- ・誕生日にもらった意外なもの
- ・天使と悪魔選手権
- ・ちょっと先の未来クイズ第2問
- ・【大喜利】【投稿~9/7】 ロボットの住む世界で流行ってる罰ゲームとは?
- ・推しミネラルウォーターはありますか?
- ・都道府県穴埋めゲーム
- ・この人頭いいなと思ったエピソード
- ・準・究極の選択
- ・ゆるやかでぃべーと タイムマシンを破壊すべきか。
- ・「I love you」 をかっこよく翻訳してみてください
- ・歩いた自慢大会
- ・許せない心理テスト
- ・字面がカッコいい英単語
- ・昔のあなたへのアドバイス
- ・かっこよく答えてください!!
- ・あなたが好きな本屋さんを教えてください
- ・これ何て呼びますか Part2
- ・人生で一番思い出に残ってる靴
- ・ゆるやかでぃべーと すべての高校生はアルバイトをするべきだ。
- ・初めて自分の家と他人の家が違う、と意識した時
- ・単二電池
- ・チョコミントアイス
デイリーランキングこのカテゴリの人気デイリーQ&Aランキング
-
オンマウスで、画像切り替え+...
-
Gifアニメ、最後のコマに行った...
-
jQueryスライドショー画像への...
-
HTMLで条件分岐はできますか?
-
javascriptで毎月替わる画像
-
画像をフォルダに入れれば表示...
-
クリッカブルマップの一部分だ...
-
jQuery FlexSliderのカルーセ...
-
ページの背景画像を短冊状に切...
-
Twitterの埋め込みしたWebペー...
-
簡単に画像を自動切替できるJav...
-
thickbox 次の画像への移動の...
-
画像の重なりの順序を代える方...
-
MAX関数を使ってからLEFT JOIN...
-
createElementが一瞬で消えてし...
-
Gif画像のアニメーションが再生...
-
JavaScriptで変更した属性の元...
-
html スクロール要素を下から表...
-
JSで動的にリンクを作成
-
連番画像「次へ」「前へ」で、...
マンスリーランキングこのカテゴリの人気マンスリーQ&Aランキング
-
textareaに画像を表示したい
-
Gifアニメ、最後のコマに行った...
-
JavaScript スライドの画像にリ...
-
bxsliderにて読み込み後に内容...
-
透過pngの透明部分以外をクリッ...
-
JavaScriptとチェックボックス...
-
クリッカブルマップの一部分だ...
-
innerHTMLで、表示すると、一部...
-
Javascriptで指定した日付と時...
-
画像をフォルダに入れれば表示...
-
1枚の画像をクリックすると複数...
-
WEBページ立ち上げ時に1回のみ...
-
image.onload = .. の後に imag...
-
美人時計風JAVAスクリプトが上...
-
曜日と時間を指定して表示画像...
-
決まった曜日で一定時間だけ表...
-
画面の表示位置を指定させて表...
-
jQuery FlexSliderのカルーセ...
-
特定の画像を非表示にする方法
-
iframe内のリンク文字のマウス...
おすすめ情報