旧イメージマップの画像とテキストを同時に表示されるようにした。クリッカブル・マップ

スポンサーリンク

イメージマップ

級サイトで下に表示していたイメージマップ

なんですけど・・・こちらでは・・・?
前から画像が表示画面に対して拡大縮小しないので文字が画面から消えたり
テーブルが崩れたりするので画像にしています。

この時にしている画像は 300×300で余分なところを透明にする作業だけなので
隣り合う画像のをむりやり地図に合うようにしているので透明部分で鑑賞している状態でしたので
画像にマウスオンで色が変わるようにしていたんだけど繊細なところの認識がしにくい・・・

次にしたかったことは

テキスト部にマウスオンしても画像部の位置がわかるようにしたい。
まぁテキスト部も画像なんだけど・・・でも、わからない。

検索しても説明はあるが初歩の初歩がわからない・・・

悩んで悩んで・・・何日か見ていたら・・・あれ?何かいけるかも??

挑戦してみよた。!

クリッカブルマップを使ってロールオーバーさせてみたい

言葉の意味は、分かってないんだけど・・・

上のやつも一応そうなのかな・・・?

こちらは、まぁ座標がめんどくさいのと・・・
イレギュラー時の間違いがよくわからないで
時間だけがかかった。前のも同じ状態だから似たよなもんか・・・

地図の画像の文字が見にくいし・・・

マウスオン時を白黒にしたのでまぁ見にくいんだけど・・・

まぁ何もできな状態からの結果なので満足しておきます。

・・・スマホとかでは、反応しないみたいな感じです・・・

サイト移行後 機能してないです。クリッカブル・マップ


豊中地図

千里地区ロマン地区刀根山柴原地区蛍池地区岡町走井地区本町区上野東豊中地区旭泉丘桜塚地区曽根原田地区緑地区小曽根豊南地区服部地区利倉名神地区庄内地区最南地区

千里地区ロマン地区刀根山柴原地区蛍池地区岡町走井地区本町区上野東豊中地区旭泉丘桜塚地区曽根原田地区緑地区小曽根豊南地区服部地区利倉名神地区庄内地区最南地区



※素人なので雑なイメージマップです。区分名等に意味なく画像の問題もあり。
※スマホなどでは反応しないみたいです。

前野サイトの内容をそのまま移行しても機能してないし…
こちらに必要なもの移行しても画像の切り替えが機能してないです。

画像はサイトに合わせて融通が利いていますが合わせているポイントがフルの画像じゃないと位置が合わぅてないです。

今は、特に必要ないのでなんかやり方忘れました…

サイト作成関連
スポンサーリンク
jyankをフォローする
この記事が気に入ったら
いいね!しよう
最新情報をお届けします。
スポンサーリンク
とよエンジン home

コメント