![](http://oshiete.xgoo.jp/images/v2/pc/qa/question_title.png?e8efa67)
すみません、jquery初心者です。
下記の様にコードを書きました。
マウスをのせてから、2秒後にフェイドインはしたのですが、
一瞬だけマウスをのせてもフェイドインしてしまいます。
$(function(){
$("div#aaa").hide();
$("div#bbb a").mouseover(function(){
setTimeout( function () {
$("div#aaa").fadeIn(1500);
} , 2000 );
});
try { clearTimeout(); } catch ( e ) {}
});
マウスをのせてながら、2秒後にフェイドインさせる場合は
どのように書けば良いのでしょうか?
ご教授頂けると助かります。
何卒、よろしくお願いします。
No.1ベストアンサー
- 回答日時:
御提示のスクリプトだと、mouseoverしたら必ず2秒後に表示するというふうになります。
>一瞬だけマウスをのせてもフェイドインしてしまいます。
一瞬でもマウスがはずれたら表示しないのか、2秒後にマウスがそこにあれば一度はずれていても表示するのかなどによって考え方が変わると思いますが、前者ならマウスがはずれたらTimeoutの処理を中止すればよさそう。後者ならば2秒後の処理の際にマウスが対象の上にあれば表示、なければ処理しないというふうにするとか…
ご参考までに…
(全角空白は半角に)
<前者の場合>
$(function(){
$("div#aaa").hide();
var timerId;
$("div#bbb a").mouseover(function(){
timerId = setTimeout(function(){
$("div#aaa").fadeIn(1500);
}, 2000 );
}).mouseout(function(){
clearTimeout(timerId);
});
});
<後者の場合>
$(function(){
$("div#aaa").hide();
var flag;
$("div#bbb a").mouseover(function(){
flag = true;
setTimeout(function(){
if(flag) $("div#aaa").fadeIn(1500);
}, 2000 );
}).mouseout(function(){ flag = false; });
});
fujillin様
ご回答有難う御座います。
説明不足で申し訳ございません。
前者の方です。
大変助かりました!
本当に有難う御座いました。
お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!
似たような質問が見つかりました
- JavaScript 指定したパスが現URLに含まれていたら特定要素を削除するJavascriptのコードを教えてください 2 2023/04/27 17:58
- JavaScript jQueryでのドラッグアンドドロップについて 1 2022/07/30 09:10
- JavaScript jQueryでのドラッグアンドドロップについて 1 2022/07/07 21:04
- JavaScript JavaScript?jQuery?で書き方を教えてください。 初心者です。 AAAという要素をステ 2 2023/08/04 22:09
- JavaScript javascriptで移動ボタンを押した際に遷移するボタンを追記したい 1 2022/11/29 03:02
- JavaScript jqueryを使ったスムーススクロールのコードを書いたのですが、HTMLコード内にある、a butt 2 2022/04/14 10:59
- JavaScript ソースコードのいじる場所が分かりません。 1 2022/12/23 02:06
- JavaScript 入力フォームの javascript で メールアドレスの正規チェックをを行い、ボタンをクリックして 2 2022/04/27 16:06
- JavaScript 画像の表示位置 3 2022/12/23 08:25
- JavaScript コードレビューをお願いします。 1 2022/07/16 05:38
関連するカテゴリからQ&Aを探す
おすすめ情報
デイリーランキングこのカテゴリの人気デイリーQ&Aランキング
-
関数でy=g(x)のgとは何の略です...
-
JAVAスクリプトで指定時間以降...
-
functionから別のfunctionを実...
-
jQueryの"return false"の役割...
-
【JavaScript】二重送信防止
-
関数の中の値を取り出したい
-
マウスをのせてながら、2秒後に...
-
C#OpenCv V4にのエラーに関する...
-
JavaScriptとHTMLの課題です
-
<a>タグのテキストを取得
-
FireFoxのjavascriptで自動でキ...
-
クリッカブルマップのリンク部...
-
同じIDで定義した要素の配列を...
-
GASでundefinedエラーが出ます
-
【正規表現】【javascript】CR...
-
DOM要素を削除しても、イベント...
-
window.openでタイトル名の指定
-
ドラッグでセルを選択した後に
-
TexでΣの添え字の位置直し
-
undefinedを表示させない方法は...
マンスリーランキングこのカテゴリの人気マンスリーQ&Aランキング
-
関数でy=g(x)のgとは何の略です...
-
idを使わずにonclickで自身の要...
-
functionから別のfunctionを実...
-
jslintのエラーについて質問
-
要素名がスペースを含む場合のj...
-
javascript(jQuery)でセル内...
-
ajax反映後のjqueryが動かない
-
jQueryの :not() .not() が有効...
-
getElementByIdを使用したグロ...
-
コードをスマートにさせたい。
-
クリックすると上に開くアコー...
-
jQueryの"return false"の役割...
-
jQueryが読み込めない
-
個別では動く、javascriptのエラー
-
一つのアクションで関数を二つ...
-
jqueryの変数を関数の外に出す方法
-
R言語
-
jQuery|:not(:animated)
-
即時関数でプライベート変数的...
-
スムーズに動く アニメーション...
おすすめ情報