• ベストアンサー
※ ChatGPTを利用し、要約された質問です(原文:ゆっくり上から下に出てくるポップアップウィンドウ)

ゆっくり上から下に出てくるポップアップウィンドウ

このQ&Aのポイント
  • ゆっくり上から下に出てくるポップアップウィンドウを作成するためのJavaScriptのコードを教えてください。
  • ポップアップウィンドウの表示アニメーションにゆっくりと下から上へ移動するエフェクトを追加したいです。
  • Fireworksで作成したポップアップウィンドウにJavaScriptのコードを追加する方法を教えてください。

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

  • ベストアンサー
  • fujillin
  • ベストアンサー率61% (1594/2576)
回答No.1

作ることが目的なのか、使うことが目的なのか…? 使うのが目的ならば、ご提示のサイトのものを利用するのが一番早いのではないでしょうか?(速度も指定可能になっているみたいだし) 配布サイト(↓) http://plugins.jquery.com/project/droppy 作るのが目的ならば、人に作ってもらっても意味ないでしょうし… ご提示のscriptを改造しようにも、まずその前に、対象としているHTMLを推理することから始めなければなりません。(情報がないので)

riko421
質問者

お礼

ご回答ありがとうございました。

全文を見る
すると、全ての回答が全文表示されます。

関連するQ&A

  • javascript getelementsbytagnameについてです。

    var keisan=document.getElementsByTagName('input'); for(i=0;i<=keisan.length;i++){ if(keisan[i].getAttribute('value').match('Click')){ keisan[i].onclick=add(); } } function add() { var a = document.getElementById('number1').value; var b = document.getElementById('number2').value; var c = a - -b; alert(c); } 上のプログラムを入れると、"keisan[i]はnullです"といったエラーがでます。 kaisan.length=0になっているみたいです…。 xhtmlだと作動するのですが、htmlだと作動しません。 対応してないのでしょうか? 宜しくお願いいたします。

  • popupウィンドウでborderがcollapseなテーブル利用の問題

    popupウィンドウにテーブルを使用していて、 border-collapse: collapse のボーダーがある場合に、 初期表示時点で、そのボーダーのみが表示されてしまいます。 firefox,operaでは起きずIE6で起きます。 そこで非表示にするためのjavascript をonloadで動かしているのですが、 データ量の大きいページだと、表示された後に消えるのが 見えてしまい不細工です。 最初から枠が表示されないようなcssの指定方法はないでしょうか。 <html> <head> <script> <!-- function PopupOn(Msg){ if(document.all){ MyMsg = document.all(Msg).style; MyMsg.visibility = "visible"; } else if(document.layers){ MyMsg = document.layers[Msg]; MyMsg.visibility = "show"; } else if(document.getElementById){ MyMsg = document.getElementById(Msg).style; MyMsg.visibility = "visible"; } } function PopupOff(Msg){ if(document.all) document.all(Msg).style.visibility = "hidden"; else if(document.layers) document.layers[Msg].visibility = "hide"; else if(document.getElementById) document.getElementById(Msg).style.visibility = "hidden"; } //--> </script> <style> <!-- #poplink {position:absolute;left:0px; top:30px; z-index:9; visibility:hidden;} #poplink table {border-collapse: collapse; background-color: #ffffff;} #poplink td {border: 2px solid #00ffff; } //--> </style> </head> <body onload="PopupOff('poplink')" > <div id="poplink"> <table width="80px" height="80px"> <tr><td> [<a onClick="PopupOff('poplink')">閉じる</a>]<br /> ポップアップ </td></tr></table> </div> <a href="#" onClick="PopupOn('poplink')">リンク</a><br /> </body> </html>

    • ベストアンサー
    • HTML
  • java詳しい方宜しくお願いします。

    <!--HPB_SCRIPT_CODE_40 function _HpbShowObj(lId) { var ob;ob=new Array; var appVer=parseInt(navigator.appVersion); var isNC=false,isN6=false,isIE=false; if (document.all && appVer >= 4) isIE=true; else if (document.getElementById && appVer > 4) isN6=true; else if (document.layers && appVer >= 4) isNC=true; if (isNC) { w_str = "document." + lId;ob[lId] = eval(w_str); if (!ob[lId]) ob[lId] = _HpbFindHiddenObj(document, lId); if (ob[lId]) ob[lId].visibility = "show"; } if (isN6) { ob[lId] = document.getElementById(lId); ob[lId].style.visibility = "visible"; } if (isIE) { w_str = "document.all.item(\"" + lId + "\").style";ob[lId] = eval(w_str); ob[lId].visibility = "visible"; } } function _HpbFindHiddenObj(doc, lId) { for (var i=0; i < doc.layers.length; i++) { var w_str = "doc.layers[i].document." + lId; var obj;obj=new Array; obj[lId] = eval(w_str); if (!obj[lId]) obj[lId] = _HpbFindHiddenObj(doc.layers[i], lId); if (obj[lId]) return obj[lId]; } return null; } //--> </script> これは何をするスクリプトでしょうか? ぜひご教授下さいませ。

    • ベストアンサー
    • Java
  • 何を言っているのか教えて下さい

    Dreamweaverで出てきたものなのですが意味が分からないんで困ってます教えて下さい. function MM_swapImgRestore() { //v3.0 var i,x,a=document.MM_sr; for(i=0;a&&i<a.length&&(x=a[i])&&x.oSrc;i++) x.src=x.oSrc; } function MM_preloadImages() { //v3.0 var d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array(); var i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0; i<a.length; i++) if (a[i].indexOf("#")!=0){ d.MM_p[j]=new Image; d.MM_p[j++].src=a[i];}} } function MM_findObj(n, d) { //v4.0 var p,i,x; if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) { d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);} if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n]; for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].document); if(!x && document.getElementById) x=document.getElementById(n); return x; } function MM_swapImage() { //v3.0 var i,j=0,x,a=MM_swapImage.arguments; document.MM_sr=new Array; for(i=0;i<(a.length-2);i+=3) if ((x=MM_findObj(a[i]))!=null){document.MM_sr[j++]=x; if(!x.oSrc) x.oSrc=x.src; x.src=a[i+2];} }

  • JavaScriptエラーについて

    お世話になります。 おわかりになる方、ぜひ教えてください。 タブメニューのボタンを押すと、内容が切り替わるというJavaScriptなのですが、いちよう正常に動作はしているようなのですが、エラーがでてしまいます。 エラーを無くしたいのですが、どうすればいのでしょうか? 【エラー内容】 'document.getElementById()'はNullまたはオブジェクトではありません。 【HTML】 <div id="javascript_tab_sample"> <ul> <li><a href="#W3C">W3C</a></li> <li><a href="#xhtml">xhtml</a></li> </ul> <dl id="w3c"> <p>内容1</p> </dl> <dl id="xhtml"> <p>内容2</p> </dl> </div> 【JavaScript】 window.onload=function() { tab.setup = { tabs: document.getElementById('tab').getElementsByTagName('li'), pages: [ document.getElementById('w3c'), document.getElementById('xhtml') ] } tab.init(); } /*--setup end--*/ var tab = { init: function(){ var tabs = this.setup.tabs; var pages = this.setup.pages; for(i=0; i<pages.length; i++) { if(i !== 0) pages[i].style.display = 'none'; tabs[i].onclick = function(){ tab.showpage(this); return false; }; } }, showpage: function(obj){ var tabs = this.setup.tabs; var pages = this.setup.pages; var num; for(num=0; num<tabs.length; num++) { if(tabs[num] === obj) break; } for(var i=0; i<pages.length; i++) { if(i == num) { pages[num].style.display = 'block'; tabs[num].className = 'selected'; } else{ pages[i].style.display = 'none'; tabs[i].className = null; } } } } よろしくお願いします。

  • z-indexを指定したボックスの下に表示させる

    z-indexとjavascriptを組み合わせて下記のようなページを作っています。 <html lang="ja"> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> <title>ああああ</title> <meta http-equiv="Content-Script-Type" content="text/JavaScript" /> <meta http-equiv="Content-Style-Type" content="text/css" /> <script type="text/javascript"> <!-- function MM_showHideLayers() { //v9.0 var i,p,v,obj,args=MM_showHideLayers.arguments; for (i=0; i<(args.length-2); i+=3) with (document) if (getElementById && ((obj=getElementById(args[i]))!=null)) { v=args[i+2]; if (obj.style) { obj=obj.style; v=(v=='show')?'visible':(v=='hide')?'hidden':v; } obj.visibility=v; } } //--> </script> <style type="text/css"> div#aaa { z-index: 2; position:absolute; width: 300px; } div#bbb { z-index: 1; position:absolute; width: 300px; } </style> </head> <body> <h1>あああ</h1> <p><a onclick="MM_showHideLayers('aaa','','show','bbb','','hide')">ううう</a> / <a onclick="MM_showHideLayers('aaa','','hide','bbb','','show')">えええ</a></p> <div id="aaa" style="visibility:visible"> <h2>ううう</h2> <p>うううううううう<br /> うううううううう</p> </div> <div id="bbb" style="visibility:hidden"> <h2>えええ</h2> <p>えええええええええ<br /> えええええええええ<br /> えええええええええ<br /> えええええええええ<br /> えええええええええ</p> </div> <p>いいいいいいいいい<br /> いいいいいいいいい</p> </body> </html> 切り替わるdivの下に<p>いいいい</p>を表示させたいのですが、後ろに回って表示されません。 これを表示させる方法をご存じでしたら教えてください。

    • ベストアンサー
    • HTML
  • クイズの解説ボタンをつけて表示非表示を切り替えたい

    1.前提・実現したいこと クイズ問題の下に解説ボタンをつけて表示非表示を切り替えたい 発生している問題・エラーメッセージ clickBtn2 is not defined 該当のソースコード <サンプルコード> ------------------------------ <input type="button" value="解説" onclick="clickBtn2()" /> <p id="p2">テスト1</p> <script> //初期表示は非表示 document.getElementById("p2").style.visibility ="hidden"; function clickBtn2(){ const p2 = document.getElementById("p2"); if(p2.style.visibility=="visible"){ // hiddenで非表示 p2.style.visibility ="hidden"; }else{ // visibleで表示 p2.style.visibility ="visible"; } } </script> ----------------------------- 自分で調べたことや試したこと ------------------- <h2>解説</h2> <div id="text_k"></div> <input type="button" value="解説" onclick="clickBtn2()"/> <script type="text/javascript"> /問題と解答 const qa = [ {q:"イルカを漢字で書くとどれ?",a:["海豚","海牛","河豚","河豚"],c:0,k:"くじら目はくじら亜目の小型海獣の総称。からだは紡錘(ぼうすい)形で、前肢はひれとなる。群れをなして泳ぎ、しばしば船について走る。マイルカ・ネズミイルカなど種類が多い。"}, //問題表示 QA.prototype.quiz = function() { //問題 document.getElementById("text_q").innerHTML = (this.mondai_no + 1) + "問目:" + this.mondai_data[this.mondai_no].q; //この問題の選択肢の数は自動判断(選択肢は何個でもOKです) var answer_count=this.mondai_data[this.mondai_no].a.length; //選択肢 var s = ""; for (var n=0;n<answer_count;n++) { s += "【<a href=&#039;javascript:test.answer(" + n + ")&#039;>" + (n+1) + ":" + this.mondai_data[this.mondai_no].a[n] + "</a>】"; } document.getElementById("text_s").innerHTML = s; document.getElementById("text_k").innerHTML= this.mondai_data[this.mondai_no].k; } QA.prototype.clickBtn2 =function() { //初期表示は非表示 document.getElementById("text_k").style.visibility ="hidden"; const text_k = document.getElementById("text_k"); if(text_k.style.visibility=="visible"){ // hiddenで非表示 text_k.style.visibility ="hidden"; }else{ // visibleで表示 text_k.style.visibility ="visible"; } } よろしくお願いします。

  • お詳しい方どうぞ宜しくお願い致します。

    <!--HPB_SCRIPT_CODE_40 function _HpbShowObj(lId) { var ob;ob=new Array; var appVer=parseInt(navigator.appVersion); var isNC=false,isN6=false,isIE=false; if (document.all && appVer >= 4) isIE=true; else if (document.getElementById && appVer > 4) isN6=true; else if (document.layers && appVer >= 4) isNC=true; if (isNC) { w_str = "document." + lId;ob[lId] = eval(w_str); if (!ob[lId]) ob[lId] = _HpbFindHiddenObj(document, lId); if (ob[lId]) ob[lId].visibility = "show"; } if (isN6) { ob[lId] = document.getElementById(lId); ob[lId].style.visibility = "visible"; } if (isIE) { w_str = "document.all.item(\"" + lId + "\").style";ob[lId] = eval(w_str); ob[lId].visibility = "visible"; } } function _HpbFindHiddenObj(doc, lId) { for (var i=0; i < doc.layers.length; i++) { var w_str = "doc.layers[i].document." + lId; var obj;obj=new Array; obj[lId] = eval(w_str); if (!obj[lId]) obj[lId] = _HpbFindHiddenObj(doc.layers[i], lId); if (obj[lId]) return obj[lId]; } return null; } //--> </script> これは何をするスクリプトでしょうか? これはテンプレートに記述されていたコードで 何のために必要か知りたかったので 一旦削除してサーバにアップしてみたのですが きちんと表示されていて問題なさそうでした。 すみませんがぜひご教授下さいませ。 宜しくお願い致します。

  • JavaScriptエラーが出ます…

    2つのJavaScriptエラーが出て大変困っております。 どなたか分かる方いらっしゃいませんでしょうか? ※当方はJavaScriptは分かりません。 検索にて調査いたしましたが、情けないですがもうお手上げ状態です。 ▼1つめ----------------------------------------------▼ メッセージ: 'null' は Null またはオブジェクトではありません。 ライン: 8 文字: 3 コード: 0 コード内容 以下 var accordion=function(){ var tm=10; var sp=10; function slider(n){ this.nm=n; this.arr=[]; this.sel='' } slider.prototype.init=function(t,c,k){ var a,h,s,l,i; a=document.getElementById(t); h=a.getElementsByTagName('dt'); s=a.getElementsByTagName('dd'); l=h.length; for(i=0;i<l;i++){ var d=h[i]; this.arr[i]=d; d.onclick=new Function(this.nm+".process(this)"); if(k!=null&&c==i){this.sel=d.className=k} } l=s.length; for(i=0;i<l;i++){ var d=s[i]; d.maxh=d.offsetHeight; if(c!=i){d.style.height='0'; d.style.display='none'} } } slider.prototype.process=function(d){ var i,l; l=this.arr.length; for(i=0;i<l;i++){ var h=this.arr[i]; var s=h.nextSibling; if(s.nodeType!=1){s=s.nextSibling} clearInterval(s.timer); if(h==d&&s.style.display=='none'){ s.style.display=''; setup(s,1); h.className=this.sel} else if(s.style.display==''){setup(s,-1); h.className=''} } } function setup(c,f){c.timer=setInterval(function(){slide(c,f)},tm)} function slide(c,f){ var h,m,d; h=c.offsetHeight; m=c.maxh; d=(f==1)?Math.ceil((m-h)/sp):Math.ceil(h/sp); c.style.height=h+(d*f)+'px'; c.style.opacity=h/m; c.style.filter='alpha(opacity='+h*100/m+')'; if(f==1&&h>=m){clearInterval(c.timer)} else if(f!=1&&h==1){c.style.display='none'; clearInterval(c.timer)} } return{slider:slider} }(); ▲1つめここまで----------------------------------------------▲ ▼2つめ----------------------------------------------▼ メッセージ: 'obj.length' は Null またはオブジェクトではありません。 ライン: 238 文字: 10 コード: 0 コード内容 以下 http://www.myulond.com/js.txt ▲1つめここまで----------------------------------------------▲ どうぞ、ご教授よろしくお願いいたします。

  • これだけ複雑なのには何か意味が・・・?

    Dreamweaverでロールオーバーを作ると以下のスクリプトが生成されます。それぞれが何をしてるかは分かるのですが、なぜここまで複雑なのでしょうか?ただロールオーバーを実現させるならもっと単純なソースがいくらでもあるのに・・・。もし企業サイトでしたら、あらゆるブラウザでの動作が出来る必要がありますが、その為のプログラムが書いてあるのでしょうか? function MM_swapImgRestore() { //v3.0 var i,x,a=document.MM_sr; for(i=0;a&&i<a.length&&(x=a[i])&&x.oSrc;i++) x.src=x.oSrc; } function MM_preloadImages() { //v3.0 var d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array(); var i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0; i<a.length; i++) if (a[i].indexOf("#")!=0){ d.MM_p[j]=new Image; d.MM_p[j++].src=a[i];}} } function MM_findObj(n, d) { //v4.0 var p,i,x; if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) { d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);} if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n]; for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].document); if(!x && document.getElementById) x=document.getElementById(n); return x; } function MM_swapImage() { //v3.0 var i,j=0,x,a=MM_swapImage.arguments; document.MM_sr=new Array; for(i=0;i<(a.length-2);i+=3) if ((x=MM_findObj(a[i]))!=null){document.MM_sr[j++]=x; if(!x.oSrc) x.oSrc=x.src; x.src=a[i+2];} }

このQ&Aのポイント
  • コロナ感染後、免疫異常を思わせる症状が出たため、精密検査を受けました。
  • 血液検査の結果、リンパ球が基準値を下回っていました(17%)。
  • 医師は触れず、気にするほどではないかもしれませんが、詳しいアドバイスを求めています。
回答を見る

専門家に質問してみよう