javascriptについてです｡添付画像はchromeのﾃﾞﾍﾞﾛｯﾊﾟｰﾂｰﾙを使っているときの画面の一部ですが､右上の四角のｱｲｺﾝをｸﾘｯｸし､ｶｰｿﾙをﾍﾟｰｼﾞ内の要素上に…

人力検索はてな

ﾓﾊﾞｲﾙ版を表示しています｡PC版はこちら

javascriptについてです｡

添付画像はchromeのﾃﾞﾍﾞﾛｯﾊﾟｰﾂｰﾙを使っているときの画面の一部ですが､
右上の四角のｱｲｺﾝをｸﾘｯｸし､ｶｰｿﾙをﾍﾟｰｼﾞ内の要素上に合わせると､
要素の上に､要素と同ｻｲｽﾞの半透明の要素？を表示し､
要素のｻｲｽﾞやclassなどをﾂｰﾙﾁｯﾌﾟで表示します｡

これと同じ事をjavascriptでしたいのですが､
参考になるｻｲﾄはありませんでしょうか｡

できれば､jqueryを使わないﾀｲﾌﾟが良いのですが､
無ければ､jqueryを使うﾀｲﾌﾟでも構いません｡

宜しくお願い致します｡

●拡大する

●質問者: worldtravel
●ｶﾃｺﾞﾘ:ｺﾝﾋﾟｭｰﾀｳｪﾌﾞ制作
○ 状態 :ｷｬﾝｾﾙ
└ 回答数 : 1/1件

▽最新の回答へ

▽1 ● Cherenkov

tooltipというｷｰﾜｰﾄﾞでﾗｲﾌﾞﾗﾘを検索すればいろいろ見つかります｡
jqueryに依存しないのはこれとか
Tippy.js - Vanilla JS Tooltip and Popover Library https://atomiks.github.io/tippyjs/

【JavaScript】ﾂｰﾙﾁｯﾌﾟを表示させる超軽量ﾗｲﾌﾞﾗﾘ［Tippy.js］の使い方 - ONZE http://on-ze.com/archives/7310

worldtravelさんのｺﾒﾝﾄ
ありがとうございます｡ただ､あらかじめ設定した部分にﾂｰﾙﾁｯﾌﾟを表示したいだけではないのです｡ﾍﾟｰｼﾞ内の全ての要素でﾏｳｽｵｰﾊﾞｰすると表示する方法を知りたいのです｡

● 質問者から

わかりにくくて申し訳ありません｡

添付画像の場合ですと､｢ﾒｰﾙ｣の上にｶｰｿﾙを合わせていますが､
そのとき､
｢ﾒｰﾙ｣の上に､透過された青いｵｰﾊﾞｰﾚｲが表示され､
｢ﾒｰﾙ｣の要素のﾀｸﾞ名､ｻｲｽﾞなどがﾂｰﾙﾁｯﾌﾟで表示されます｡

もちろん､最初にidなどを付けておき､
そこにﾏｳｽｵｰﾊﾞｰしたときだけに表示したいわけではありません｡

chromeの機能拡張にに組み込む予定で､
どのﾍﾟｰｼﾞでもどの要素でも機能するようにすることが目的です｡