![](http://oshiete.xgoo.jp/images/v2/pc/qa/question_title.png?e8efa67)
【javascript】ロールオーバーと画像自動切換えがバッティングして、ロールオーバーがきいていません。
javascriptは該当の動作がどれかというのが分かる程度で、書く事も修正する事もできません。
ロールオーバーが正常に動いていたページに画像自動切換えのスクリプトを設置したところ、ロールオーバーが動かなくなりました。
ページの遷移に問題はないのですが、他ページでは出来ているので何とかしたいと思っています。どうかお助け下さい。
≪ロールオーバー≫
function initRollovers() {
if (!document.getElementById) return
var aPreLoad = new Array();
var sTempSrc;
var aImages = document.getElementsByTagName('img');
for (var i = 0; i < aImages.length; i++) {
if (aImages[i].className == 'imgover') {
var src = aImages[i].getAttribute('src');
var ftype = src.substring(src.lastIndexOf('.'), src.length);
var hsrc = src.replace(ftype, '_o'+ftype);
aImages[i].setAttribute('hsrc', hsrc);
aPreLoad[i] = new Image();
aPreLoad[i].src = hsrc;
aImages[i].onmouseover = function() {
sTempSrc = this.getAttribute('src');
this.setAttribute('src', this.getAttribute('hsrc'));
}
aImages[i].onmouseout = function() {
if (!sTempSrc) sTempSrc = this.getAttribute('src').replace('_o'+ftype, ftype);
this.setAttribute('src', sTempSrc);
}
}
}
}
≪画像切り替え≫
window.onload = function(){
var num = 1;
setInterval(function(){
document.getElementById('link' + num).style.display = 'none';
num = document.getElementById('link' + (num+1))? ++num : 1;
document.getElementById('link' + num).style.display = 'block';
},7500);
}
No.1ベストアンサー
- 回答日時:
全体がどのような記述をしているのか不明ですが、ご提示の通りだとすれば、initRollovers()が実行されていないので、ロールオーバーの設定がされていないということでは?
≪画像切り替え≫のwindow.onloadの最後に( } の手前)に1行追加して
initRollovers();
を入れてあげればよさそうですが…
>他ページでは出来ているので
そのページはどこかでinitRollovers()を呼び出すようになっていると思うのですが…
早速のご回答ありがとうございました!
こちらで正常に動くようになりました。
内容を拝見しても何が何だかサッパリわからない所が悔しいです。。。
もっと精進します。
ありがとうございました。
No.2
- 回答日時:
これはロールオーバーが利かないのではなく、利いているのに自動切り替えが常に動いているために書き換えられてしまうということではないでしょうか。
window.onload = function(){
var num = 1;
setInterval(function(){
を
window.onload = auto_roll();
function auto_roll(){
var num = 1;
timerID = setInterval(function(){
として、functionを独立させ、タイマーのID番号を控えておきます。
aImages[i].onmouseover = function() {
の次の行に
setTimeout(timerID);
を追加し、タイマーを止めます。
aImages[i].onmouseout = function() {
の次の行に
auto_roll();
を追加し、タイマーを呼び出します。
早速のご回答ありがとうございます!
試してみましたが、うまく動作しませんでした。。。
せっかく書いていただいたのにごめんなさい。
ありがとうございました!
お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!
似たような質問が見つかりました
- JavaScript 1日1回引けるJavaScriptおみくじについて 1 2022/12/12 22:28
- JavaScript 画像の表示位置 3 2022/12/23 08:25
- JavaScript html5に変えるとスライドショーが消えてしまった。 3 2022/03/26 19:53
- JavaScript javascriptで変数を組み込みたい 2 2023/01/13 09:52
- JavaScript jQueryでのドラッグアンドドロップについて 1 2022/07/07 21:04
- JavaScript jQueryでのドラッグアンドドロップについて 1 2022/07/30 09:10
- JavaScript スマフォではボタンを表示させたくない 2 2023/01/20 14:26
- JavaScript clear機能を失わずにファイルアップロード機能を作成したい 3 2023/06/10 16:12
- JavaScript JAVASCRIPT 2 2022/04/15 15:10
- JavaScript jQueryで同じクラス名のものを別物として扱いたい 1 2022/06/17 14:14
関連するカテゴリからQ&Aを探す
おすすめ情報
デイリーランキングこのカテゴリの人気デイリーQ&Aランキング
-
window.openで値の渡し方を教え...
-
画像をランダムな座標に一定の...
-
JavaScriptを外部ファイルにす...
-
MAX関数を使ってからLEFT JOIN...
-
前回の質問の続き
-
jQueryスライドショー画像への...
-
画像の表示位置
-
JavaScript スライドの画像にリ...
-
ポップアップのソースの書き方...
-
デフォルト非表示にしたい。【t...
-
onclickとonmouseoverを同時に...
-
複数トリガーで動作するアコー...
-
背景色を透明化
-
バッチファイルでカウントアッ...
-
ホームページビルダー15 メニュ...
-
createElementが一瞬で消えてし...
-
タブで開いてさらにタブ内をア...
-
スライダーを実装した場合、ペ...
-
スマートフォンサイトに部分的...
-
jQueryで特定のURLの時のみ表示
マンスリーランキングこのカテゴリの人気マンスリーQ&Aランキング
-
window.openで値の渡し方を教え...
-
this.src等のthisについて
-
imgのsrcに値を設定するには
-
jQueryでサーバー上のファイル...
-
画像の座標位置取得
-
イベントハンドラを完全に外部...
-
連番画像「次へ」「前へ」で、...
-
画像の下に説明文をつけて切り...
-
JS switch文について
-
JavaScriptでリクエストを飛ば...
-
スマートな外部javaでロールオ...
-
JavaScriptでシンプルなスライ...
-
一定時間で画像とリンク先を変...
-
javascript 時計24時間表示
-
画像と文字を同時に切り替えたい
-
これはどんなJavaScriptなので...
-
Javaにて画像を残像が残りつつ...
-
FirefoxでonMouseOver/Outの動...
-
divの背景画像を、徐々に表示さ...
-
時間によって表示される画像を...
おすすめ情報