締切済み

JavaScript、以外に手が都とがないHtml

2013/04/01 07:40

現在Javaスクリプトのお勉強も兼ねて悪質な自動スクリプト敵滅に日々勤しんでるものなんですが指定時間内に別のページに飛ぶスクリプトで頭を悩ませてるところです。基本「五秒間エンカンウト」したのちに自動的に別のサイトに飛ぶ等の一連のプロセスはmetaタグを使ってrefresh属性を使って飛ぶのがベストのようにどうしても絞り込まれてしまいます。それも一つのやり方ではありますがそれだと使わなくてはイケないブラウザが絞られてキマすし第一大量のリンクや画像にアクセスするのにはあまり向いてはいない。そこで以下の様なソースを提示します。 ----------------Htmlに埋め込まれたJavascript <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <HTML> <HEAD> <META name="GENERATOR" content="IBM WebSphere Studio Homepage Builder Version 11.0.0.0 for Windows"> <META http-equiv="Content-Type" content="text/html; charset=Shift_JIS"> <META http-equiv="Content-Style-Type" content="text/css"> <script type="text/javascript"> var j=0; var ADC = { /* ↓設定１表示する広告 []内に '画像パス+ファイル名' をカンマで区切って並べる。長い場合区切りのカンマ, 直後の改行は可能 */ imgs:['imge/eli0181.jpg','imge/eli0181_1.jpg','imge/eli0181_2.jpg'] , /* ↓設定２画像と同じ順でリンク先を登録。書式は画像と同じ */ anc:['imgs/eli0181.jpg','imgs/eli0181_1.jpg','imgs/eli0181_2.jpg'] , /* ↓設定３表示用画像タグのID '' で囲む */ id:'ADimage1' , /* ↓設定４リンク先を開くウィンドウ 0:このウィンドウ 1:ウィンドウを開く */ win:1 , /* ↓設定５広告切替時間 1000 = 1秒 */ sec:3000 , /* ↓設定６ループ 0:しない 1:する */ loop:0 , /* 設定項目終り */ set:function(O){ /*↑関数を決め時の単なる名前*/ if(!document.getElementById && !document.all){ return false; /*allは一番目も含めたすべての画像の意味*/} O.tmp =[]; for(var i=0; i<O.imgs.length; i++){O.tmp[i] = new Image(); O.tmp[i].src = O.imgs[i];} O.ido = document.getElementById(O.id) || document.all(O.id); /*idはHtml上からしか習得できず、しかもOnlyOneである*/ O.add(O.ido,'click', function(){ if(O.win){ /*window.open(O.anc[O.now],'AD');*/ }else{ top.location.href = O.anc[O.now]; }}); O.ido.style.cursor = 'pointer'; if(O.Tid){clearTimeout(O.Tid); } O.now =-1; var CHG = function(){ if(++O.now >= O.tmp.length|| !O.tmp[O.now]){ if(!O.loop){ return false; } O.now = 0; } j+=1; O.ido.src = O.tmp[O.now].src; O.Tid = setTimeout(CHG, O.sec); }; CHG(); },add:function(obj, type, func){ if(obj.addEventListener){ obj.addEventListener(type, func, false); /*Listerner(アクション,関数, objクラスの複数のプロパティを同一ソース上で上書きできるしかし、メソッドそのものは区別がある*/ }else{ if(obj.attachEvent) obj.attachEvent('on' + type, func); } },Tid:undefined }; ADC.add(window, 'load', function(){ ADC.set(ADC) }); </script> <TITLE></TITLE> </HEAD> <BODY> <img id='ADimage1' src="imge/eli0181.jpg"> </BODY> </HTML> -------------------------------------------------------------------------------- 参照元:http://www.artemis.ac/contents/javascript/jscopy5.htm このソースを見る限りメソッド部分にのみ限定してラインINを行う再帰処理のように思えます。ページ間の合間に合間に意図的に初歩的な文字表示からHtmlページ挿入まで色々やってみましたが思ったようなアウトカウントを得ることができません。自分は最終的に何をしたいかというと、極小的にいえば川島教授の鬼トレに出てくる「鬼計算」や「鬼記号」や「鬼耳算」のような知育用のゲームを一般的に公開していきたいと考えています。つまり流動的に瞬間暗記して決められたリズムで正しく正確にフィードバックも兼ねつつ決められバック数だけ遡る様なプログラムをです。クラアイアントが指定した回想数またはバック数の要求に対して入力フォームなどのレスポンスを返したいのです。

masutoro32
お礼率28% (2/7)

JavaScript
回答数1
ありがとう数0

みんなの回答 （1）
専門家の回答

みんなの回答

CyberCypher
ベストアンサー率73% (39/53)

2013/04/02 13:19 回答No.1

タイポが酷く読み辛いです本題に対して言えば ”正しく正確に”とは完全には不可能です。 javascriptはクライアント言語とはいえクライアントのブラウザ環境に依存するためアドオンなどにより動作が阻害されてしまう恐れがありリアルタイム処理でも時間が飛んでしまったりと正確ではありませんそれでも処理をしたいのなら setTimeoutが無難でしょう今回例に挙げている中にも使われていますが時間を計測する時や一定時間ごとに処理をしたいのであれば setTimeoutかsetIntervalがプログラムの肝となるかと…… ステップ数やカウントなどをグローバルに持っておき即時実行関数ではなく明確に関数を定義して逐次処理を行えば良いかと思いますアウトカウントとは何でしょうか？不正解の問題数という事でしょうか？独自に定義した単語を使用しないか説明をいただけると理解しやすくなると思います。ところでjQueryは使用する予定はあるのでしょうか？コード数、ステップ数が増えるのならjQueryを使用した方が楽な場合もあります flashを作成して埋め込むのも一つの手段です出かけ先なので取り急ぎ返答まで……

関連するQ&A

javascriptで画像の切替えとCSSの指定
javascriptで画像の切替えとCSSの指定でわかりません以前、以下のhtmlを雑誌を見ながらやってみたのですが、わからないことが２点あります。回答を頂ければ大変助かります。１つ目の質問です。最初の画像が切り替わるのに１０秒かかってしまうのですが、これを最初の画像とともにすべての画像の切替を５秒にしたいのですがわかりません。２つ目の質問です。CSSで指定してある画像にあてはめたいのですが、書き方がわかりません。以下のimgs[0] = "http://www.●.com/●1.jpg"; この部分に <div id="▲img"></div> を付けていいものなのか、別な書き方があるのかがわかりません。ＣＳＳ側→ #▲img { background-image: url(..●1.jpg); } <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <HTML> <HEAD> <script type="text/javascript"> var imgs = new Array(); var links= new Array(); imgs[0] = "http://www.●.com/●1.jpg"; imgs[1] = "http://www.●.com/●2.jpg"; links[0]="http://www.■.co.jp" links[1]="http://www.■.co.jp" i = 0; function Blend(){ document.getElementById("imgframe").filters.blendTrans.apply(); document.all.item("imgframe").src = imgs[i++]; document.getElementById("imgframe").filters.blendTrans.play(); document.getElementById("link").href=links[i]; if(i>=imgs.length) i=0; } onload = function(){setInterval(Blend,5*1000)} </script> <META name="GENERATOR" content="IBM WebSphere Studio Homepage Builder Version 12.0.0.0 for Windows"> <META http-equiv="Content-Type" content="text/html; charset=ISO-2022-JP"> <META http-equiv="Content-Style-Type" content="text/css"> <META name="IBM:HPB-Input-Mode" content="mode/flm; pagewidth=750; pageheight=900"> <TITLE></TITLE> </HEAD> <BODY> <a href="http://www.■.co.jp" id=link> <img src="http://www.●.com/●1.jpg" id="imgframe" style="filter:blendTrans(duration=2);"></img> </a> </BODY> </HTML> 以上です。何卒よろしくお願い致します。
- ベストアンサー
- JavaScript
Javascript画像切り替えIEでしか動かない
Javascriptで画像を切り替えています。 IEでは動くのですが他のブラウザだと動きません。 FirefoxやChromeは何か特殊なのでしょうか？わかる人いたら教えてください。 <script type="text/javascript"> var imgs = new Array(); imgs[0] = "img/top2.jpg"; imgs[1] = "img/top3.jpg"; imgs[2] = "img/top1.jpg"; i = 0; function Blend(){ document.getElementById("imgframe").filters.blendTrans.apply(); document.all.item("imgframe").src = imgs[i++]; document.getElementById("imgframe").filters.blendTrans.play(); if(i>=imgs.length) i=0; } onload = function(){setInterval(Blend,3*1000)} </script> <img src="img/top1.jpg" width="940" height="350" id="imgframe" style="filter:blendTrans(duration=1);">
- ベストアンサー
- JavaScript
javascriptでMYSQLに接続したい
下記のクリック時に画像を変更するjavascript内で、画像を変更するたびに現在の画像が何かをデータベースに値として格納したいのですがやり方が分かりません。現在の画像がA.gifだったらデータベースに0を格納、B.gifだったら1を格納するといった仕様です。どなたかご教授お願いできませんでしょうか？よろしくお願いします。 <script> function change(obj){ var orgimg="B.gif"; var newimg="A.gif"; var imgs=document.getElementsByTagName('img') for(var i=0;i<imgs.length;i++){ if(imgs[i].className==obj.className){ if(imgs[i]==obj) imgs[i].src=newimg; else imgs[i].src=orgimg; } } </script>
- 締切済み
- JavaScript
HTML内への2つのJavaScriptの書き込みについて
お世話になります。この1週間皆様のお力をお貸しいただいてようやくほぼ完成というところまでこぎつけました！！本当に皆様のご協力に感謝です！ありがとうございます。 HTML内に、JavaScriptファイルへのリンクが2点そのほかにJ Queryのギャラリーを利用しているため、 HTMLに直接書いてある　下記Javascriptがあります。 $('#thumbs-adv ul.thumbs li').css('opacity', onMouseOutOpacity) .hover( function () { $(this).not('.selected').fadeTo('fast', 1.0); }, function () { $(this).not('.selected').fadeTo('fast', onMouseOutOpacity); } ); $(document).ready(function() { var galleryAdv = $('#gallery-adv').galleriffic('#thumbs-adv', { delay:2000, numThumbs:16, <省略. . . . . . > onTransitionOut:function(callback) { $('#slideshow-adv, #caption-adv').fadeOut('fast', callback); }, onTransitionIn:function() { $('#slideshow-adv, #caption-adv').fadeIn('fast'); }, onPageTransitionOut:function(callback) { $('#thumbs-adv ul.thumbs').fadeOut('fast', callback); }, onPageTransitionIn:function() { $('#thumbs-adv ul.thumbs').fadeIn('fast'); } }); var galleryMin = $('#gallery-min').galleriffic('#thumbs-min', { imageContainerSel:'#slideshow-min', controlsContainerSel:'#controls-min' }); }); ここに、まだ他のJavaScriptをHTMLページ内に追加したいのですが、追加すると、 J queryのギャラリーの表示がなくなってしまいます。追加したいJavaScriptは以下です。 <script type="text/javascript" charset="UTF-8"> var M0, M1; /*@if(1)attachEvent('on'+ @else@*/addEventListener(/*@end@*/ 　'load', function () { 　　var cnt = 0, I, o; 　　var UL = document.getElementById('gazou'); 　　var LI = UL.getElementsByTagName('LI'); 　　var MI = document.getElementById('menu-index'); 　　document.getElementById('num1').firstChild.nodeValue = I = LI.length; 　　for (var i = 0; i<I; i++) { 　　　o = document.createElement('LI'); 　　　o.appendChild(document.createTextNode('○')); 　　　o.id = 'idx-' + i; 　　　MI.appendChild(o); 　　} 　　(M1 = LI[0]).style.zIndex = 2; 　}, false); document./*@if(1)attachEvent('on'+ @else@*/addEventListener(/*@end@*/ 　'mouseover', function (evt) { 　var e = evt./*@if(1) srcElement @else@*/ target /*@end@*/; 　var p = getParent(e, 'id', 'menu-index'); 　var n; 　　if (M0) { M0.firstChild.nodeValue = '●'; M0.style.color = ''; M0 = null; } 　if (p && e.nodeName == 'LI') { 　　e.firstChild.nodeValue = '●'; 　　e.style.color = 'red'; 　　M0 = e; 　　n = e.id.match(/-(\d+$)/)[1]; 　　document.getElementById('num0').firstChild.nodeValue = n - 0 + 1; 　　Image('gazou', n); 　} }, false); function getParent(node, type, val) { 　return node ? (val == node[type]) ? node: arguments.callee(node.parentNode, type, val): null; } function Image (id, vno) { 　var a = 100, LI = document.getElementById(id).getElementsByTagName('LI')[vno];if (LI == M1) return; 　var P = (function L () { 　　M1.style./*@if(1) filter = 'Alpha(opacity=' + a +')' @else@*/ opacity = a/100 +'' /*@end@*/; 　　if ((a-=20)<0) M1.style.zIndex = 0 +'', LI.style.zIndex = 2 +'', M1 = LI; else setTimeout(L, 30); 　}); 　LI.style.zIndex = 1; 　LI.style./*@if(1) filter = 'Alpha(opacity=100)' @else@*/ opacity = '1' /*@end@*/; 　P(); } // --> </script> HTML内に書き込むJavaScriptは１つでないといけないのでしょうか？また、この問題を解決するには、どうすればよいでしょうか？よろしくご教授お願いいたします！！！
- 締切済み
- JavaScript
1分毎にHTMLを切り替えるJavaScript
<script> function getImageFile(date){ var dir = 'min_img/'; var ext = 'jpg'; var hour = date.getHours(); if(hour < 10){ hour = '0' + hour; } var minute = date.getMinutes(); if(minute < 10){ minute = '0' + minute; } return dir + hour + minute + '.' + ext; } function updateClock(){ var date = new Date(); var image = getImageFile(date); date.setTime(date.getTime() + 60 * 1000); var next_image = getImageFile(date); $('#clock').fadeOut(1000, function(){ $('#clock') .html('<img src="' + image + '"><img src="' + next_image + '" style="display:none;">') .fadeIn(1000); }); setTimeout('updateClock()', 60 * 1000); } $(document).ready(function(){ updateClock(); }); </script> <body> <div id="clock"></div> </body> 上記のJavaScriptは1分毎に画像が切り替えるものです。画像でなく、インフレームでHTMLを表示したいのですが、うまくいきません。 <script> function getImageFile(date){ var dir = 'html/'; var ext = 'html'; var hour = date.getHours(); if(hour < 10){ hour = '0' + hour; } var minute = date.getMinutes(); if(minute < 10){ minute = '0' + minute; } return dir + hour + minute + '.' + ext; } function updateClock(){ var date = new Date(); var image = getImageFile(date); date.setTime(date.getTime() + 60 * 1000); var next_image = getImageFile(date); $('#clock').fadeOut(1000, function(){ $('#clock') .html('<a href="' + image + '"></a><a href="' + next_image + '" style="display:none;"></a>') .fadeIn(1000); }); setTimeout('updateClock()', 60 * 1000); } $(document).ready(function(){ updateClock(); }); </script> <body> <iframe id="clock"></a></iframe> </body> 宜しくお願いします。
- ベストアンサー
- JavaScript
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> //////////////////////// どなかたご教授いただけますでしょうか。何卒、宜しくお願い申し上げます。
- ベストアンサー
- JavaScript
JavaScriptで配列を取得したい
お世話になります。データベースから取得したリスト(可変)をフォームに設定したところ、 JavaScriptで配列を参照したところ、リストが１件の場合はエラー、３件の場合は正常という現象がおき、困っております。リストが１件の場合でも、配列に認識させたいのですが、他の箇所も記述が多いためシンプルな手法を探しています。よろしくお願い致します。３件のレコードの場合、正常に処理される。 ---- HTML内 -------------- <input type="checkbox" name="chk_sel"> <input type="checkbox" name="chk_sel"> <input type="checkbox" name="chk_sel"> ---- JavaScript内 -------------- function test(){ var obj = document.form1.chk_sel; if (obj != null) { for(i=0;i<obj.length;i++){ if(obj[i].checked == true){ check_num++; } } } } ----------------------------- ■１件のレコードの場合、エラーになる（配列に認識されないらしく、obj.lengthが取得できない） ---- HTML内 -------------- <input type="checkbox" name="chk_sel"> ---- JavaScript内 -------------- function test(){ var obj = document.form1.chk_sel; if (obj != null) { for(i=0;i<obj.length;i++){ if(obj[i].checked == true){ check_num++; } } } } -----------------------------
- ベストアンサー
- JavaScript
javascriptでrgbを用いてスタイル設定を行った時の挙動
こんにちは。勉強の為、プログラムの作成中に気になる動作がありました。 style.backgroundでrgbで赤を設定したはずなのに深い緑色が表示されてしまいますが、何が原因なのでしょうか？以下は学習で作っていたプログラムです。 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html lang="ja"> <head> <meta http-equiv="Content-Type" content="text/html; charset=Shift_JIS"> <meta http-equiv="content-script-type" content="text/javascript"> <title>test</title> <script type="text/javascript">  </script> </head> <body> <div id="canvas"></div> てｓｔ </body> </html> 問題が発生したブラウザはIE6.0です。以上、よろしくお願いいたします。
- ベストアンサー
- JavaScript
HTMLのJavaScriptが動作しない
以下のプログラムのとおり、HTMLにテキストボックスを設置して、FORMタグのACTIONで次のPHP(PHTML)ファイルへ送る仕組みを作っています。 JavaScriptでテキストボックスが空白の場合にチェックするようにしているのですが、動作せずに次のPHPへ渡してしまいます。詳しい方よりご教授頂ければと思います。お手数お掛けして申し訳ございませんが、よろしくお願いいたします。・HTML # more index.html <HTML> <HEAD> <META http-equiv="Content-Type" content="text/html; charset=EUC-JP"> <META http-equiv="Content-Style-Type" content="text/css"> </HEAD> <BODY bgcolor="#ffffff" onload="Scrmsg()"> <SCRIPT language=JavaScript type=text/javascript> function generatorCheck(){ if(document.toroku.word1.value == ""){ alert("空白です。"); return false; } if(document.toroku.word2.value == ""){ alert("空白です。"); return false; } } </SCRIPT> <form method="POST" action="result.phtml"> <TABLE cellpadding=10> <tr><td><B>入力項目1</B></td><td><input type="text" name="word1" size=34></td><td>(例：)</td></tr> <tr><td><B>入力項目2</B></td><td><input type="text" name="word2" size=34></td><td>(例：)</td></tr> </table> <BR> <input type=submit value="作成" onClick=generatorCheck()><input type=reset value="消去"> </form> </TABLE> </BODY> </HTML> ・PHP(PHTML) # more result.phtml <? require('../include/init.inc'); $word1 = $_POST{'word1'}; $word2 = $_POST{'word2'}; ?> <HTML> <HEAD> <META http-equiv="Content-Type" content="text/html; charset=EUC-JP"> <META http-equiv="Content-Style-Type" content="text/css"> <LINK href="index.css" type="text/css" rel="stylesheet"> </HEAD> <BODY bgcolor="#ffffff" onload="Scrmsg()"> <? print ("</BR>"); print ("<B>".$word1."</B>"); print ("</BR>"); print ("<B>".$word2."</B>"); print ("</BR>"); ?> </BODY> </HTML>
- ベストアンサー
- HTML
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> ////////////////////////
- ベストアンサー
- JavaScript

JavaScript、以外に手が都とがないHtml

みんなの回答

関連するQ&A

注目のQ&A

カテゴリ
一覧

専門家に質問してみよう
専門家登録

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

JavaScript、以外に手が都とがないHtml

みんなの回答

関連するQ&A

注目のQ&A

カテゴリ 一覧

専門家に質問してみよう 専門家登録

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

カテゴリ
一覧

専門家に質問してみよう
専門家登録