fujillin の回答履歴

全4393件中1~20件表示
  • javascriptのcanvasについて

    HTML5のcanvasを勉強しています。 下記リンクのようなボタンを押すたび画像が切り替わるようなものをcanvasを使って制作したいのですが、うまく出来ませんでした。 http://homepage2.nifty.com/toraneko/ugoku-gazoukiri2.html 下記のようなサイトを参考にcanvas内に画像を表示するだけなら出来ました。 http://honttoni.blog74.fc2.com/blog-entry-187.html 配列の設定の仕方などはどのようにすれば良いのでしょうか。

  • Google Maps API ルート検索

    Google maps API V3でルート検索をする場合、 <input type="submit" value="検索" onclick="searchRoute()"> として、検索ボタンを押さないとルートが表示されないようにしたいのですが、検索する住所が ”ある市”(市町村)に限られている場合、あらかじめ検索窓に”○○市”と表示させておき、”○○市”の後に町名や番地を入力して、それから検索ボタンを押すことで初めて地図上にルートを表示させたいのですが、記述をどうすればよいか悩んでおります。 <input type="text" size="20" id="toAddress" name="to" value="○○市"> とすると、いきなり”○○市”の代表地点までのルートが表示されてしまいます。 よろしくお願い致します。

    • ベストアンサー
    • noname#245585
    • JavaScript
    • 回答数1
  • javascriptで困ってます。

    モーダルを実装するプラグイン「colorbox」を使用してgooglemapを表示しようとしてるのですがうまくいきません。以下のように作ってみたのですが、地図の一部しか読み込まれません。 いろいろ調べてみると非表示にしていたdivにgooglemapを読み込んでいるので、高さ、幅が決まっていない状態なので、地図の一部しか読み込まれないということでした。 <div id="map_canvas" style="width:100%; height:100%"><script>initialize();</script></div> のあたりも無理な記述になっています。 colorboxで非表示になっていたdivが表示になったときに地図をきちんと読み込まれるようにするにはどのようにすればよいのでしょうか?よろしくお願いします。 <html> <head> <link rel="stylesheet" type="text/css" href="css/colorbox.css" /> <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script> <script src="https://maps.googleapis.com/maps/api/js?v=3.exp&sensor=false"></script> <script src="js/jquery.colorbox.js"></script> <script type="text/javascript"> function initialize() { var latlng = new google.maps.LatLng(34.0,135.0); var opts = { zoom: 10, center: latlng, mapTypeId: google.maps.MapTypeId.ROADMAP }; var map = new google.maps.Map(document.getElementById("map_canvas"), opts); var m_latlng = new google.maps.LatLng(34.0,135.0); var marker = new google.maps.Marker({ position: m_latlng, map: map }); } $(function(){ $('.inline').colorbox({ inline:true, width:"80%", height:"80%", }); }); </script> </head> <body> <a href="#inline_content" class="inline" title="" >googlmap</a> <div style='display:none'> <div id='inline_content'> <div id="map_canvas" style="width:100%; height:100%"><script>initialize();</script></div> </div> </div> </body> </html>

  • チェックボックスにチェックでプルダウン有効化

    チェックボックスにチェックを入れると、 無効化していたプルダウンが有効化するようなフォームを作りたいと思っています。 やりたいことはまさに下記サイトに書かれているとおりなのですが 自分でやるとコピペしてもうまく動かず困っています。 http://studio3104.hatenablog.com/entry/2014/10/17/011941 当方ヴァージョンは『jquery-1.2.1.min.js』を使用しています。 無効化はできたのですが、チェックを入れても有効化しません。 『vue.js』もダウンロードしてみたものの、無効化すらうまくいかず… 何か他に方法があったりするものでしょうか? よろしくお願いします。

  • 無限ループ

    教えてください。 画面をリサイズすると画面再表示するようにしたいのですが、 下記のソースでは IE8で無限ループになります。 どこがおかしいのでしょうか? どのように直せばいいのでしょうか? jQuery(document).ready(function () { var timer = false; $(window).on("load resize", ReLayout); function ReLayout(event) { var _width = $(window).width(); var winWidth_resized; if(event.type == 'resize') { if (_width > 767) { if (timer !== false) { clearTimeout(timer); } timer = setTimeout( disp, 200); } } } function disp(){ location.href = location.href; } });

  • 無限ループ

    教えてください。 画面をリサイズすると画面再表示するようにしたいのですが、 下記のソースでは IE8で無限ループになります。 どこがおかしいのでしょうか? どのように直せばいいのでしょうか? jQuery(document).ready(function () { var timer = false; $(window).on("load resize", ReLayout); function ReLayout(event) { var _width = $(window).width(); var winWidth_resized; if(event.type == 'resize') { if (_width > 767) { if (timer !== false) { clearTimeout(timer); } timer = setTimeout( disp, 200); } } } function disp(){ location.href = location.href; } });

  • アコーディオンで開かれたパネルの位置にスクロール

    アコーディオン作成でぶつかってしまったので質問させてください。 下記サイトを参考にスマホサイトにアコーディオンを作成しました。 http://pops-web.com/main/html/demo-007.html タブをクリックしたと同時に開かれているパネルの上部にスクロールさせたいのですが、 知識が貧しく苦戦しております。 理想は下記のURLのような動きにしたいと思っています。 http://lab.boy.jp/demo/accordion/index.html どなたかお分かりの方がおられましたらご教授頂けないでしょうか。 宜しくお願いいたします。 <h3 class="trigger">ここにタイトル</h3> <div class="content"> <div class="deta">ここに内容</div> </div> <h3 class="trigger">ここにタイトル</h3> <div class="content"> <div class="deta">ここに内容</div> </div> </div> //Accordion (function($){ $(function(){ //オブジェクトを保存 var accordionItem=$('#accordion'); //一旦全部消す accordionItem.find('.content').hide(); //active要素を指定して開く var no=0; accordionItem.find('.trigger').eq(no).addClass('active').next('.content').show(); //click-action accordionItem.find('.trigger').click(function () { //slide $(this).next('.content').slideToggle('slow') .siblings('div:visible').slideUp('slow'); //activeクラス切り替え $(this).toggleClass('active'); $(this).siblings('.trigger').not($(this)).removeClass('active'); }); //hover-toggle accordionItem.find('.trigger').hover(function () { //toggle hoveredクラス $(this).toggleClass('hovered'); return false; }); }); })(jQuery); 「//activeクラス切り替え」の下に以下の2行を追加したのですが、 下の方のタブになるとスクロール位置が正しい位置にスクロールされませんでした。。 var scposi = $(".trigger.active").offset().top; $('body,html').animate({ scrollTop: scposi });

  • アコーディオンで開かれたパネルの位置にスクロール

    アコーディオン作成でぶつかってしまったので質問させてください。 下記サイトを参考にスマホサイトにアコーディオンを作成しました。 http://pops-web.com/main/html/demo-007.html タブをクリックしたと同時に開かれているパネルの上部にスクロールさせたいのですが、 知識が貧しく苦戦しております。 理想は下記のURLのような動きにしたいと思っています。 http://lab.boy.jp/demo/accordion/index.html どなたかお分かりの方がおられましたらご教授頂けないでしょうか。 宜しくお願いいたします。 <h3 class="trigger">ここにタイトル</h3> <div class="content"> <div class="deta">ここに内容</div> </div> <h3 class="trigger">ここにタイトル</h3> <div class="content"> <div class="deta">ここに内容</div> </div> </div> //Accordion (function($){ $(function(){ //オブジェクトを保存 var accordionItem=$('#accordion'); //一旦全部消す accordionItem.find('.content').hide(); //active要素を指定して開く var no=0; accordionItem.find('.trigger').eq(no).addClass('active').next('.content').show(); //click-action accordionItem.find('.trigger').click(function () { //slide $(this).next('.content').slideToggle('slow') .siblings('div:visible').slideUp('slow'); //activeクラス切り替え $(this).toggleClass('active'); $(this).siblings('.trigger').not($(this)).removeClass('active'); }); //hover-toggle accordionItem.find('.trigger').hover(function () { //toggle hoveredクラス $(this).toggleClass('hovered'); return false; }); }); })(jQuery); 「//activeクラス切り替え」の下に以下の2行を追加したのですが、 下の方のタブになるとスクロール位置が正しい位置にスクロールされませんでした。。 var scposi = $(".trigger.active").offset().top; $('body,html').animate({ scrollTop: scposi });

  • テキストボックスとセレクトボックスの選択肢の連携

    この度はお世話になります。 1個のテキストボックスに入力された文字列により、その後の1個の セレクトメニューの選択肢を変更することってできるのでしょうか? 具体的には以下のような動作です。 ・デフォルトではテキストボックスに文字列が入力された場合は、  その後のセレクトボックスには「トマト、きゅうり、ほうれんそう」  の選択肢が入る。 ・テキストボックスに「あいうえお」と入力された時のみ、その後の  セレクトボックスが「りんご、みかん、ぶどう」の選択肢に変わる。 ・テキストボックスに「かきくけこ」と入力された時のみ、その後の  セレクトボックスに「あじ、さば、かつお」の選択肢に変わる。 こんな感じですが、よろしくお願い致します。 当方、只今javascriptを勉強しており、条件式に苦戦しております。 サンプルプログラムを見せていただけるとありがたく思います。

  • テキストボックスとセレクトボックスの選択肢の連携

    この度はお世話になります。 1個のテキストボックスに入力された文字列により、その後の1個の セレクトメニューの選択肢を変更することってできるのでしょうか? 具体的には以下のような動作です。 ・デフォルトではテキストボックスに文字列が入力された場合は、  その後のセレクトボックスには「トマト、きゅうり、ほうれんそう」  の選択肢が入る。 ・テキストボックスに「あいうえお」と入力された時のみ、その後の  セレクトボックスが「りんご、みかん、ぶどう」の選択肢に変わる。 ・テキストボックスに「かきくけこ」と入力された時のみ、その後の  セレクトボックスに「あじ、さば、かつお」の選択肢に変わる。 こんな感じですが、よろしくお願い致します。 当方、只今javascriptを勉強しており、条件式に苦戦しております。 サンプルプログラムを見せていただけるとありがたく思います。

  • 次の要素が「input type」だったら削除

    下記について、それぞれJavaScriptとjQueryではどう書くのでしょうか? ・次の要素が「input type text」だったら「input type text」を削除 ・次の要素が「input type hidden」だったら「input type hidden」を削除 ※次の要素が「指定した要素」だった場合のみ削除したい、という主旨です

  • テキストボックスとセレクトボックスの選択肢の連携

    この度はお世話になります。 1個のテキストボックスに入力された文字列により、その後の1個の セレクトメニューの選択肢を変更することってできるのでしょうか? 具体的には以下のような動作です。 ・デフォルトではテキストボックスに文字列が入力された場合は、  その後のセレクトボックスには「トマト、きゅうり、ほうれんそう」  の選択肢が入る。 ・テキストボックスに「あいうえお」と入力された時のみ、その後の  セレクトボックスが「りんご、みかん、ぶどう」の選択肢に変わる。 ・テキストボックスに「かきくけこ」と入力された時のみ、その後の  セレクトボックスに「あじ、さば、かつお」の選択肢に変わる。 こんな感じですが、よろしくお願い致します。 当方、只今javascriptを勉強しており、条件式に苦戦しております。 サンプルプログラムを見せていただけるとありがたく思います。

  • jQueryのmeanMenuのカスタマイズ

    お世話になります。 meanMenuのカスタマイズで、実際に表示されるメニューの所に三本ラインが表示されます。ここをMENUというテキストに変更したいのですが、jsファイルのどこをいじれば良いでしょうか?色々なサイトを探しておりますが、昨日から希望のカスタマイズについて記述してあるサイトが見つけられません。javascriptはあまり知識がなく手探りでやっている為困っております。 カスタマイズ方法が載っているサイトを教えていただけませんか。 何卒よろしくお願いします。 meanMenuのサイト↓ http://www.meanthemes.com/plugins/meanmenu/

  • jqueryにて、独自属性を使ってタグを操作したい

    皆様 いつもお世話になります。 早速ですがご質問させていただきます。 現在、独自属性を使った学習をしております。 jqueryでidを使って以下のタグの「追加位置」に「追加要素」を挿入すると 以下のようになると思いますが、 <div id="aaa"> <!--追加位置--> </div> $(div#aaa).prepend("追加要素"); 独自属性を使って、同じことをしようとする際、idを識別するのに「#」を使うと思いますが、独自属性はどういう識別子(★にあたる箇所)を使うのでしょうか? div data-hoge="aaa"> <!--追加要素--> </div> var dokuji = $('div').attr('data-hoge'); $(★dokuji).prepend("追加要素"); お詳しい方ご教授のほど宜しくお願い致します。 開発環境: Dreamweaver CC Firefox 34.0.5

  • HTAが黙ってしまう

    HTAを使ってスクリプトを書いています。 スクリプトが動いている時は画面が一切更新されない、黙ってしまうのは、ネットを見ると避けられないようです。 せめて、何らかの方法で実行状態を表示できないでしょうか。

  • ある日付から○年○月○日目の計算

    ウェブログを始めました。 記事の隣に配置されているメニューカラムとでも申しましょうか。 そこに、自分の好きなカテゴリーを設置できると最近知りました。 そこで、「2014年3月28日から、今日で○年○月○日」と表示させるようにしたいです。 現在、「○日」という表示は出来るようになったのですが(サンプルをこぴぺで…) 未来、桁数がすさまじいことになっていくので、年月日にしたいのですが 知識がないので、どなたか、例文をご存じでしたら教えて下さい。

  • HTAが黙ってしまう

    HTAを使ってスクリプトを書いています。 スクリプトが動いている時は画面が一切更新されない、黙ってしまうのは、ネットを見ると避けられないようです。 せめて、何らかの方法で実行状態を表示できないでしょうか。

  • リンク押下でタグを書き換えたい

    リンクが複数あって、押したリンク文字だけ<span></span>のみにしたいと 思っています。また対応するdivタグのdisplay属性も書き換えたいです。 とりあえず思いついたのは以下の方法なのですが、冗長ですし、 リンクの数が増えた場合に足していくのが大変です。 もっとシンプルに書く方法がないものでしょうか。 ご助言ください。 <html> <body> <script> function change(spanid,divid,menuName){ document.getElementById('menu1').innerHTML = "<a href=\"javascript:void(0)\" onclick=\"change('menu1','div1','メニュー1')\">メニュー1</a>"; document.getElementById('div1').style.display="none"; document.getElementById('menu2').innerHTML = "<a href=\"javascript:void(0)\" onclick=\"change('menu2','div2','メニュー2')\">メニュー2</a>"; document.getElementById('div2').style.display="none"; document.getElementById('menu3').innerHTML = "<a href=\"javascript:void(0)\" onclick=\"change('menu3','div3','メニュー3')\">メニュー3</a>"; document.getElementById('div3').style.display="none"; document.getElementById(spanid).innerHTML = menuName; document.getElementById(divid).style.display="block"; } </script> <ul> <li><span id="menu1">メニュー1</span></li> <li><span id="menu2"><a href="javascript:void(0)" onclick="change('menu2','div2','メニュー2')">メニュー2</a></li> <li><span id="menu3"><a href="javascript:void(0)" onclick="change('menu3','div3','メニュー3')">メニュー3</a></li> </ul> <div id="div1"> test1 </div> <div id="div2" style="display:none"> test2 </div> <div id="div3" style="display:none"> test3 </div> </body> </html>

  • リンク押下でタグを書き換えたい

    リンクが複数あって、押したリンク文字だけ<span></span>のみにしたいと 思っています。また対応するdivタグのdisplay属性も書き換えたいです。 とりあえず思いついたのは以下の方法なのですが、冗長ですし、 リンクの数が増えた場合に足していくのが大変です。 もっとシンプルに書く方法がないものでしょうか。 ご助言ください。 <html> <body> <script> function change(spanid,divid,menuName){ document.getElementById('menu1').innerHTML = "<a href=\"javascript:void(0)\" onclick=\"change('menu1','div1','メニュー1')\">メニュー1</a>"; document.getElementById('div1').style.display="none"; document.getElementById('menu2').innerHTML = "<a href=\"javascript:void(0)\" onclick=\"change('menu2','div2','メニュー2')\">メニュー2</a>"; document.getElementById('div2').style.display="none"; document.getElementById('menu3').innerHTML = "<a href=\"javascript:void(0)\" onclick=\"change('menu3','div3','メニュー3')\">メニュー3</a>"; document.getElementById('div3').style.display="none"; document.getElementById(spanid).innerHTML = menuName; document.getElementById(divid).style.display="block"; } </script> <ul> <li><span id="menu1">メニュー1</span></li> <li><span id="menu2"><a href="javascript:void(0)" onclick="change('menu2','div2','メニュー2')">メニュー2</a></li> <li><span id="menu3"><a href="javascript:void(0)" onclick="change('menu3','div3','メニュー3')">メニュー3</a></li> </ul> <div id="div1"> test1 </div> <div id="div2" style="display:none"> test2 </div> <div id="div3" style="display:none"> test3 </div> </body> </html>

  • jqueryで置換を行いたいです。

    natsunastu_iguさん jqueryで置換を行いたいです。 http://shop.titles.tokyo/img/new/icons1.gif を http://file001.shop-pro.jp/PA01294/594/images/i_new2.png に置き換えたいのですが以下の書き方だとうまく動いてくれませんでした。 どう記載すればいいでしょうか? <div id="myToolTip0" class="display_none"> <h3>電気スタンド新作<img class="new_mark_img2" src="http://shop.titles.tokyo/img/new/icons1.gif" style="border:none;display:inline;margin:0px;padding:0px;width:auto;"></h3> </div> <Script> $(function(){ $('.new_mark_img2').replace('http://shop.titles.tokyo/img/new/icons1.gif','http://file001.shop-p... }); </script>