• ベストアンサー

オブジェクト指向のsetTimeoutの呼び出し方法

オブジェクト指向を勉強中です しかし今一しっくりきません。 setTimeoutの呼び出し部分の記述は、これでいいのでしょうか？ やりたいことは、沢山の画像を一度に違ったタイミングでフェードアウト・インをすることです。 <html> <body> <img src="./img/1.gif" width="50" height="50" id="a"> <img src="./img/2.gif" width="50" height="50" id="b"> <input type="button" value="pp" onClick="img2.fin(10,50)"> <script> var img1 = new ImageEffect( 'a',100 ); img1.fout(10,30); var img2 = new ImageEffect( 'b',100 ); img2.fout(5,30); function ImageEffect( id,val1 ){ var func=[]; this.obj = document.getElementById( id ); this.opacity=(val1==undefined)? 100:val1; this.opacitySet = function(n){ this.obj.style.filter='alpha(opacity='+n+')'; this.obj.style.MozOpacity=n/100; this.obj.style.opacity=n/100; this.opacity = n; } this.fout = function(step,wtime){ func[id] = this; this.opacity-=step; if(this.opacity<1) this.opacity = 0; this.opacitySet(this.opacity); if( this.opacity ) setTimeout( function(){ func[id].fout( step, wtime);}, wtime);//ここの呼び出し } this.fin = function(step,wtime){ func[id] = this; this.opacity+=step; if(this.opacity>100) this.opacity = 100; this.opacitySet(this.opacity); if( this.opacity ) setTimeout( function(){ func[id].fin( step, wtime);}, wtime);//ここの呼び出し } }

noname#84373
noname#84373

質問者が選んだベストアンサー

  • ベストアンサー
  • Werner
  • ベストアンサー率53% (395/735)
回答No.3

> ＞setTimeout( function(){ this.fin.call(this, step, wtime);}, wtime); > 動きませんでした^^; > 調べてみますね。 > できるなら見本を～！ ごめんなさい。最近bindに頼ってたので正しいやり方を忘れてました。 以下がサンプルになります。 <script> var objA = {}; objA.name = "objA"; objA.say = function(){alert("This name is " + this.name);}; //"This name is objA"を出すはず setTimeout( objA.say, 2000); //失敗 setTimeout( (function (this_) {return function() { this_.say.call(this_); }})(objA), 5000); //成功 </script> 最終行の外側のfunctionは、無名関数を返す無名関数で、 内側の無名関数が返却される無名関数です。 内側の無名関数を期待通りの動作をするように作ります。 なのであなたの場合はたぶんこうすればよい。(上のサンプルは試してますがこっちは試してません。) 　setTimeout( (function (this_, step_, wtime_) {return function() { this_.fin.call(this_, step_, wtime_); }})(this, step, wtime), wtime); > ちなみにprototype.jsは大きすぎて・・・ そういうときは、必要なところだけ抜き出すんですよ。 bindだけ使うなら$AとFunction.prototype.bindの定義だけ引っ張ってくれば10行程度です。 bindとbindAsEventListenerは便利だから、 理解した上で自分で同等のものを作っておくのもありだと思う。

noname#84373
質問者

お礼

ありがとうございます！ 消化するのに時間がかかりそう！ まずは、お礼まで。

noname#84373
質問者

補足

一言で「すっげ～～！」です！ 感動です！ ほとんど暗号のようで理解に苦しみました！ 最初動かしたときにスペル間違いだったのか、全然動かず、 とにかく意味を必死に理解しようとして、数日を費やしました！ まだまだ奥が深いですね。 このような書き方がかける人に、あこがれますよ～！ 有難うございました。

その他の回答 (2)

  • Werner
  • ベストアンサー率53% (395/735)
回答No.2

> if( this.opacity ) setTimeout( function(){ this.fin( step, wtime);}, wtime); > にするとエラーになって、かなり自分的に悩みました。 そういう場合は、applyやcallを使えばよいのではないでしょうか。 動作確認はしてませんが、 　setTimeout( function(){ this.fin.call(this, step, wtime);}, wtime); で動かない？ prototype.jsのbindを使ってもいいかもね。 prototype.jsのbindを理解する - cloned.log http://d.hatena.ne.jp/cloned/20070301 というか、よく見たら http://labs.cybozu.co.jp/blog/kazuho/archives/2006/12/oo-settimeout.php でもapply/call使ってるじゃないですか。 せっかく自分で見つけたんですから参考にしましょうよ～。

noname#84373
質問者

補足

＞setTimeout( function(){ this.fin.call(this, step, wtime);}, wtime); 動きませんでした^^; 調べてみますね。 できるなら見本を～！ ちなみにprototype.jsは大きすぎて・・・ 頼らずにやってみたい！

  • t_netbug
  • ベストアンサー率34% (15/44)
回答No.1

どの辺がしっくり来ないのかが不明です。。。 このソースの場合だとsetTimeout内に無名関数を記述して、つまりpipiさんの書き方でしか書けないと思うんですが。 ちなみにsetIntervalを使用しなかった理由は何でしょう？ 学生時代がJavaだったせいかIntervalの方がRunnableインターフェースのrunと同じような書き方ができるので個人的には好きなのですけど。 勉強不足がばれそうですが、速度とかメモリの食い方が違うんですか？ それにしてもJavaScriptは面白いですね＞ｗ＜

noname#84373
質問者

補足

しっくりこないとは 「オブジェクト指向　setTimeout」で検索すると 以下のようなところにあたりました http://labs.cybozu.co.jp/blog/kazuho/archives/2006/12/oo-settimeout.php なので、そのような書き方をすればいいのかと・・・ if( this.opacity ) setTimeout( function(){ func[id].fin( step, wtime);}, wtime);を if( this.opacity ) setTimeout( function(){ this.fin( step, wtime);}, wtime); にするとエラーになって、かなり自分的に悩みました。 根本的なところを理解するのが不十分で消化不良な気がして質問してみました。 setIntervalを使用しなかった理由ですが、 作業が終了したら、clearTimeoutする必要があるし、そのtimeIdを 保存して置かなければならないためです。（基本的に短いコードが大好き！） 同じタイミングでもsetTimeoutの方が処理を終えるまで時間が必要だし、なめらかさを要求する処理には不向きな面がありますが、 やっぱり短いので使いました！だめかなぁ～？ ＞（その）書き方でしか書けないと思うんですが を見て、ちょっと安心しました^^; ＞それにしてもJavaScriptは面白いですね まったく同感です。 一ヶ月前のコードが古く感じてしまい、書き直しまくりで 前に進んでいないような気がしてます。 ありがとうございます

  1. カテゴリ
  2. [技術者向] コンピューター
  3. プログラミング・開発
  4. JavaScript

関連するQ&A

  • 画像の切り替え。もっと効率の良い書き方は？

    LightBoxに対抗するわけではありませんが、 画像を切り替えるものを書いてみました。 思いのほか、コードの量が多くなったような気がします。 まだオブジェクトの考え方があまいのか・・・。 もっと効率的な書き方があったら教えていただけませんか？ <html> <body> <div> 効率的にそして最良のものをもとめて！ <img src="./img/img0.jpg" width="300" height="200" id="im0" onClick="new changeImage( 'im0','im1',4,20 )"> <img src="./img/img1.jpg" style="display:none" id="im1" onClick="new changeImage( 'im1','im0',4,20 )"> </div> <script> /*@cc_on@*/ function changeImage( elementId0, elementId1, step, wtime ){ this.go = function(){ this.obj0.style.top = ( this.cy - ( this.hy += this.sy ) ) + 'px'; this.obj0.style.left = ( this.cx - ( this.hx += this.sx ) ) + 'px'; this.obj0.style.width = ( this.hx * 2 ) + 'px'; this.obj0.style.height = ( this.hy * 2 ) + 'px'; setOpacity( this.obj0, this.obj0_opacity -= this.op ); setOpacity( this.obj1, this.obj1_opacity += this.op ); if( this.obj0_opacity <=1 ) { this.obj0.style.display = 'none'; clearInterval( this.tmid ); } } this.obj0 = ( typeof( elementId0 ) == 'string' )? document.getElementById( elementId0 ): elementId0; this.obj1 = ( typeof( elementId1 ) == 'string' )? document.getElementById( elementId1 ): elementId1; this.hx = (this.obj0.offsetWidth / 2 |0);//imgの半分 this.hy = (this.obj0.offsetHeight /2 |0); this.cx = this.obj0.offsetLeft + this.hx;//imgの中心 this.cy = this.obj0.offsetTop + this.hy; this.sx = this.obj0.offsetWidth / (400 / step);//大きくなる量 this.sy = this.obj0.offsetHeight / (400 / step); this.op = step;//透明の量 setOpacity( this.obj0, this.obj0_opacity =100 ); setOpacity( this.obj1, this.obj1_opacity =0 ); this.obj1.style.top = this.obj0.style.top = this.obj0.offsetTop + 'px'; this.obj1.style.left = this.obj0.style.left = this.obj0.offsetLeft + 'px'; this.obj1.style.width = this.obj0.style.width = this.obj0.offsetWidth + 'px'; this.obj1.style.height = this.obj0.style.height = this.obj0.offsetHeight + 'px'; var style = /*@if(1)this.obj0.currentStyle@else@*/ document.defaultView.getComputedStyle(this.obj0, '')/*@end@*/; this.obj1.style.display = style.display; this.obj1.style.position = style.position; this.obj0.style.position = 'absolute'; this.tmid = setInterval((function(f_){ return function(){ f_.go.call(f_);}})(this), wtime); function setOpacity( obj , n ){ if(n<0) n=0; if(n>100) n=100; /*@if(1) obj.style.filter = 'alpha(opacity='+ n+ ')'; @else @*/ obj.style.MozOpacity = ( n / 100); obj.style.opacity = ( n / 100);/*@end@*/ } } </script>

  • JavaScriptのsetTimeoutについて

    setTimeoutのタイマー処理の仕様を調べています。 var func = function () { alert(1); }; setTimeout(func, 1000); alert(2); このコードを実行した場合、alert(2)→alert(1)の順で処理されるのは当然ですが、 alert(2)を開いたまま1秒以上待ち、そこでOKボタンを押すとどうなるか、という問題です。 Firefoxの実装については下記ページで分かりました。 http://takoyakim.tumblr.com/post/10875885/firefox-settimeout 先ほどのコードの1000ミリ秒の経過処理は、タイマースレッドという専用スレッドで扱うため、 alert(2)で1000ミリ秒以上止めた後にOKボタンを押すと、即座にalert(1)が開きます。 しかしIEの場合はそうではなく、alert(2)を閉じてから約1000ミリ秒後にalert(1)が開きました。 alert(2)を開いたままどれだけ待機しても変わりません。 ChromeやSafariもIEと同じようです。 ですがこの結果は、次のコードの実行結果と矛盾してしまいました。 var heavyFunc = function () { for(var i = 0; i < 100000; i++) new Date(); } var startTime = +new Date(); var callCount = 0; var testFunc = function (x) { heavyFunc(); // (1) if (++callCount < 5) setTimeout(testFunc, 100); else alert(+new Date() - startTime); //heavyFunc(); // (2) }; testFunc(); heavyFuncという重い処理を、setTimeoutの前後のどちらに置くかという実験コードです。 setTimeoutのタイマー処理がFirefoxのように別スレッドで実行されているのであれば、 先にsetTimeoutを呼び出してからheavyFuncを実行した方が速く処理が完了するだろう、という想定です。 そして結果は、FirefoxだけでなくIEとChromeでも先にsetTimeoutを呼んだ方が速い、となりました。 結局どのブラウザも専用のタイマースレッドを実装しており、 alert関数が特殊（タイマースレッドもブロックする）なだけ、ということなのでしょうか？ それとも私が何か見落としているのでしょうか。

  • javascriptでのフェードイン

    javascriptで画像表示をフェードインにしたいと思っております。 ネット上の情報から以下のソースを使用しております。 1html上に一つの画像を配置すると問題無く機能するのですが、 複数の画像を表示しようとすると一つ目の画像しか表示されません。 どこを変更すれば良いのか分からず困っております・・・ 修正方法、もしくはもっと簡単な方法がございましたら教えていただけないでしょうか。 ※以下のサンプルでは画像は二つですが、実際の使用時には制約上は無制限で画像を配置する予定です。 （Photologのサムネイル表示での使用を想定しております。） ///javascript file/// document.write("<style type='text/css'>#thephoto {visibility:hidden;}</style>"); window.onload = function() {initImage()} function initImage() { imageId = 'thephoto'; image = document.getElementById(imageId); setOpacity(image, 0); image.style.visibility = "visible"; fadeIn(imageId,0); } function fadeIn(objId,opacity) { if (document.getElementById) { obj = document.getElementById(objId); if (opacity <= 100) { setOpacity(obj, opacity); opacity += 25; window.setTimeout("fadeIn('"+objId+"',"+opacity+")", 100); } } } function setOpacity(obj, opacity) { opacity = (opacity == 100)?99.999:opacity; // IE/Win obj.style.filter = "alpha(opacity:"+opacity+")"; // Safari<1.2, Konqueror obj.style.KHTMLOpacity = opacity/100; // Older Mozilla and Firefox obj.style.MozOpacity = opacity/100; // Safari 1.2, newer Firefox and Mozilla, CSS3 obj.style.opacity = opacity/100; } window.onload = function() {initImage()} //////////////////////// ///html file/// <html> <head> <title></title> <script type="text/javascript" src="fade.js"></script> </head> <body> <img src="img_01.jpg" id="thephoto" /></div> <img src="img_02.jpg" id="thephoto" /></div> </body> </html> //////////////////////// どなかたご教授いただけますでしょうか。 何卒、宜しくお願い申し上げます。

  • 続き]　divの背景画像を、徐々に表示させるには？

    トップページの２つのdivボックスの背景画像を、徐々に表示されるようにするjavascriptを作って頂いたのですが、リピートをやめる方法を御教えいただくのを忘れてしまいました！ （http://oshiete1.goo.ne.jp/qa3921804.html） リピートをとめるには、下記ソースをどのようにすればよろしいでしょうか？ ------------------------------------------------------------ fade.js ------------------------------------------------------------ var after = 10; // 秒数を指定 var tid1; var tid2; window.onload = function () { fdi2(); tid2=window.setInterval("fdi2()", after*1000); }; function fdi2() { var img1 = document.getElementById("limg"); img1.style.visibility = "visible"; fadeIn("limg", 0); var img2 = document.getElementById("rimg"); img2.style.visibility = "visible"; fadeIn("rimg", 0); } function fadeIn(imgId, opacity) { if (opacity <= 100) { setOpacity(document.getElementById(imgId), opacity); opacity += 10; tid1=window.setTimeout("fadeIn('" + imgId + "'," + opacity + ")", 80); } else { window.clearTimeout(tid1); } } function setOpacity(img, opacity) { img.style.filter = "alpha(opacity:" + opacity + ")"; img.style.KHTMLOpacity = opacity / 100; img.style.MozOpacity = opacity / 100; img.style.opacity = opacity / 100; }

  • setTimeoutを使った再帰

    初めて質問させて頂きます。 setTimeoutで呼び出してるか否かと、言う違いしか無いと、言う事を思いますが、次に挙げる2つのプログラムの動作が異なる理由をどなたかお教え頂けませんか? <script type="text/javascript"> <!-- var x; function FUNCTION1(){ x = 0; FUNCTION2(x); } function FUNCTION2(x){ if ( x < 10 ) { x++; window.alert(x); FUNCTION2(x); } } //--> </script> <body onload="javascript: FUNCTION1();"> ─────────────────────────── <script type="text/javascript"> <!-- var x; function FUNCTION1(){ x = 0; FUNCTION2(x); } function FUNCTION2(x){ if ( x < 10 ) { x++; window.alert(x); setTimeout("javascript: FUNCTION2(x);", 1000); } } //--> </script> <body onload="javascript: FUNCTION1();">

  • setTimeoutのthis参照について

    prototypeメソッドの中でsetTimeout関数を使用したところ、thisで自身の関数を参照しなくなりました。setTimeoutの挙動についてぐぐってみたのですが、いまいちsetTimeoutを使用したときのスムーズな記述方法がわかりません。 ******************************** var hoge=function(){ this.myName="ほげ"; } hoge.prototype={ init:function(){ setTimeout(function(){ hoge.prototype.displayName(); //　★(1)setTimeout関数の中でのメソッドの適した呼び出し方は？ // ↑の記述でも呼び出せるけど、間違ってる気がする。。 },1000) }, displayName:function(){ // ★(2)ここでhogeオブジェクトのmyNameプロパティを参照するにはどう記述すれば良いのか？ //console.log(this.myName); //↑setTimeoutを使ったのでthis参照はwindowオブジェクトになっているから違う //console.log(hoge.myName); →undefinedを返す } } window.onload=function(){ var a=new hoge(); a.init(); } ******************************** 上記のようなprototype関数を使用したときのスムーズな記述方法を教えていただけませんでしょうか。 知りたいのは下記2点です。 ★(1)prototypeメソッドを使用したとき、setTimeout関数の中でのメソッドの適した呼び出し方は？ ★(2)setTimeout関数内で呼び出したメソッドから、自身のオブジェクトのプロパティを参照するにはどう記述すれば良いのか？ 初心者なので説明が下手だったり、質問内容で間違った記述があるかもしれません。 質問内容で問題がありましたらご指摘いただけると助かります。

  • javascriptでのフェードイン

    javascriptを使用してhtml上の画像をフェードインにて表示したいと思っております。 ネット上の情報とこちらのサイトでのアドバイスを元に以下のソースを使用しておりますが WindowsのIE（6&7）で確認すると「エラー：オブジェクトがありません」と表示されてしまいます。 こちらで確認したところjavascript最後の行の「window.onload～」がエラーの原因となっているようなのですが、 修正する記述方法が分からず困っております。 解決策をご存じの方がおられましたらお手数ですが、 ご教授いただけないでしょうか。 何卒、宜しくお願い申し上げます。 ///javascript file（fade.js）/// document.write("<style type='text/css'>#thephoto1 {visibility:hidden;}</style>"); document.write("<style type='text/css'>#thephoto2 {visibility:hidden;}</style>"); document.write("<style type='text/css'>#thephoto3 {visibility:hidden;}</style>"); function initImage() { for(i=1;i<4;i++){ imageId = 'thephoto' + i; image = document.getElementById(imageId); setOpacity(image, 0); image.style.visibility = "visible"; fadeIn(imageId,0); } } function fadeIn(objId,opacity) { if (document.getElementById) { obj = document.getElementById(objId); if (opacity <= 100) { setOpacity(obj, opacity); opacity += 25; window.setTimeout("fadeIn('"+objId+"',"+opacity+")", 100); } } } function setOpacity(obj, opacity) { opacity = (opacity == 100)?99.999:opacity; // IE/Win obj.style.filter = "alpha(opacity:"+opacity+")"; // Safari<1.2, Konqueror obj.style.KHTMLOpacity = opacity/100; // Older Mozilla and Firefox obj.style.MozOpacity = opacity/100; // Safari 1.2, newer Firefox and Mozilla, CSS3 obj.style.opacity = opacity/100; } window.onload = function() { initImage() } //////////////////////// ///html file/// <html> <head> <script type="text/javascript" src="fade.js"></script> </head> <body> <img src="img_01.jpg" id="thephoto1" /> <img src="img_02.jpg" id="thephoto2" /> <img src="img_03.jpg" id="thephoto3" /> </body> </html> ////////////////////////

  • JQueryによるclass名での背景切り替え

    下記ソースでおかしな挙動がでているので質問させて頂きます。 jQuery導入済みで２つのブロックの背景に同じクラス名を指定した上で背景を一定時間ごとに切り替えているのですが、指定していたクラスタをid名からclass名に変えただけで切り替えがおかしくなりました。 id名のとき 00→01→00→01→00→01→…… class名のとき 00→01→00→00→01→01→01→01→…… クラス名にしたことが原因でしょうか？ function testBack(obj){ var t = '.changeBg'; if (obj>3){obj=0;} $(t).fadeIn(1000).css('background','url('bg_0'+ obj +'.jpg) center top no-repeat'); obj++; $(t).delay(8000).fadeOut(1000,function(){ setTimeout('testBack('+obj+')', 100); }); } $(document).ready(function(){ if ($('body').attr('class') != 'testBox'){ testBack(0); var img=new Array(); img[0]=new Image(); img[0].src= rootPath+'commons/images/bg_00.jpg'; img[1]=new Image(); img[1].src= rootPath+'commons/images/bg_01.jpg'; } });

  • JavaScriptで自動的に画像に表示されるALT属性を消したい

    以前、こちらでご質問させて頂き、 下記のJavaScript記述を教えて頂いたのですが、 画像にALT属性が自動的に入ってしまい 色々手を入れているうちに混乱してきてしまいました。 複数サムネイル画像をScriptで呼び出し、 オンマウスで拡大画像を表示、 それぞれのサムネイルにもリンクを張るという 少し入り組んだ仕様です。 ALT属性がリンク先ページのURLを表示してしまうため、 どうしても気になって消したいのですが、 もし分かる方がいらっしゃれば教えて頂けないでしょうか・・・ <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"> <title>TEST</title> <style type="text/css"> .smlimg { width:120px; height:80px; } #bigimg { width:600px; height:400px; } #a { width:600px; height:100px; overflow:auto; } </style> <div><img src="" id="bigimg"></div> <div id="a"><div id="b"></div></div> <script type="text/javascript"> //@cc_on var simage = 'p0.jpg p1.jpg p2.jpg p3.jpg p4.jpg p5.jpg'.split(' '); var bimage = 'p0.jpg p1.jpg p2.jpg p3.jpg p4.jpg p5.jpg'.split(' '); var jmpurl = 'htp:/test.xxx0.com htp:/test.xxx1.com htp:/test.xxx2.com htp:/test.xxx3.com htp:/test.xxx4.com htp:/test.xxx5.com '.split(' '); var bufimg = []; addEvent( window, 'load', init); addEvent( 'b', 'mouseover', chgimg ); addEvent( document.body, 'click', chgurl ); function init(){ var w=0; for(var i in simage){ bufimg[i] = new Image; bufimg[i].src = bimage[i]; var image = document.createElement('img'); with( image ){ src = simage[i]; alt = bimage[i];title = jmpurl[i]; className = 'smlimg'; } var p = document.getElementById('b').appendChild( image ); w+=p.offsetWidth; } document.getElementById('b').style.width=w+'px'; var r = Math.random()*i|0; setbimg( bufimg[r].src, jmpurl[r] ); } function chgimg( evt ){ var obj = evt.target || evt.srcElement; if( obj.className && obj.className == 'smlimg') setbimg( obj.alt, obj.title ); } function chgurl( evt ){ var obj = evt.target || evt.srcElement; if( obj.className == 'smlimg' || obj.id == 'bigimg' ) window.open( obj.title ); } function setbimg(s,t){with( document.getElementById('bigimg')){alt=s;title=t}; changeImage('bigimg',s,5,20);} function addEvent(elementId, evt, eventHandler, flag){ var element = ( typeof( elementId ) == 'string' )? document.getElementById( elementId ): elementId; element./*@if(1)attachEvent('on'+ @else @*/addEventListener(/*@end@*/evt, eventHandler, flag); } var ff=0; function changeImage( elementId, imgsrc, step, wtime ){ this.setOpacity = function(n){ this.opacity = n; this.obj.style./*@cc_on @if(1) filter = 'alpha(opacity='+ this.opacity+ ')'; @else @*/ MozOpacity = this.obj.style.opacity = this.opacity / 100;/*@end@*/ } this.go = function(){ var f=0; this.setOpacity( this.opacity += this.step ); if( this.opacity<0 || this.opacity>100 ) { clearInterval( this.tmid ); this.obj.parentNode.removeChild( this.obj ); ff=0; } } if(ff) return; ff=1; var tobj = ( typeof( elementId ) == 'string' )? document.getElementById( elementId ): elementId; tobj.style.position='absolute'; var wrap = document.createElement( 'img' ); wrap.src = tobj.src; wrap.style.top = tobj.offsetTop +'px'; wrap.style.left = tobj.offsetLeft +'px'; wrap.style.width = tobj.offsetWidth +'px'; wrap.style.height = tobj.offsetHeight +'px'; wrap.style.position = 'absolute'; tobj.style.position=''; this.obj = document.body.appendChild( wrap ); tobj.src = imgsrc; this.setOpacity( 100 ); this.step = -step; this.tmid = setInterval((function(f_){ return function(){ f_.go.call(f_);}})(this), wtime); } </script>

  • jQueryの関数から変数を取得

    次のうち変数valを取得してこれとは別の関数で利用したいのですが、どうやればこの変数を取得出来るのでしょうか？ 単純な関数だと関数名を付けて戻り値にvalを指定してそれを呼び出してあげれば良いと思うのですが、この場合はどうしたら良いのか分からず頭を悩ませています。 var timer = false; var replaceWidth = 320; var prefWidth = parseInt( $( window ).width() ); $( window ).resize( function () { if( timer !== false ) { clearTimeout( timer ); } timer = setTimeout( function () { var self = $( this ); var windowWidth = parseInt( $( window ).width() ); if( windowWidth <= replaceWidth && replaceWidth < prefWidth ) { var val = 1; } else if( replaceWidth < windowWidth && prefWidth <= replaceWidth ) { var val = 10; } prefWidth = windowWidth; }, 200 ); });

注目のQ&A

カテゴリ

専門家に質問してみよう

職業から探して質問する

あなたにピッタリな商品が見つかる！ OKWAVEセレクト

質問する