投稿

ラベル(js)が付いた投稿を表示しています

Dreamweaverでhtmlタグを綺麗にする設定(ソースコードのフォーマット)

イメージ
 Dreamweaverでhtmlを作成していると、プログラマーの人に渡した時に「タブスペースや改行がくずれる」という現象が起きる。 というのも、Dreamweaverでタグをエンター改行すると、インデント分の空白が勝手にタブで入ったりしてしまうのだ。 今まではその都度手作業でスペース入れたりしていたのだが、ちょっとdiv増やしたりするともうスペースの入れ直し!! …というのが一発で解消する方法を知ったので、設定を含めてメモ。 まずは上部メニューの「Dreamweaver」→「環境設定」を開く その中にある「コードフォーマット」で、上記設定をしておく。 ・インデント:☑を使用「2」「スペース」 ・タブサイズ:「2」☑スペースとして挿入 ・TDタグ:□TDタグ内に改行を含めない コード画面左側にある「ソースコードのフォーマット」をクリック その中にメニューとして「コードフォーマット設定」があるので、それを選ぶ。 タグごとに細かな設定ができるので、自分が一番見やすいように修正する。 自分の場合は「a」「div」「head」「button」を修正。 aタグの設定 改行:タグの前後 コンテンツ:フォーマットおよびびインデントあり divの設定 改行:前、中間、後 コンテンツ:フォーマットおよびびインデントあり buttonの設定 改行:前、中間、後 コンテンツ:フォーマットおよびインデントあり headの設定 改行:前、中間、後 コンテンツ:フォーマット及びインデントあり 最後に、「ソースフォーマットの適用」 ソース画面左の「ソースコードのフォーマット」アイコンを押して、「ソースフォーマットの適用」を選択すると、開いているソースの中身が整形されます。 ざっと見直して問題なければこれで完了!

cssアニメーションを使用して、画面スクロールでぬるっと出現するコンテンツを作成

※jqueryが必要  ■js //画面のロード、タブレットの縦横切り替えで動く $(window).on("load orientationchange resize", function() {   scroll_effect();   scroll_effect2();   //画面のスクロール、タッチによるスクロールで動く   $(window).on("scroll touchmove", function(){     scroll_effect();     scroll_effect2();   });   //フェードイン   function scroll_effect(){     $('.fadein').each(function(){       var elemPos = $(this).offset().top;       var scroll = $(window).scrollTop();       var windowHeight = $(window).height();       if (scroll > elemPos - windowHeight){         $(this).addClass('scrollin');       }     });   }   //スライドイン   function scroll_effect2(){     $('.slidein').each(function(){       var elemPos = $(this).offset().top;       var scroll = $(window).scrollTop();       var windowHeight = $(...

多面ダイス(サイコロ)の計算javascript共通関数

多面ダイスの共通関数 function dice(num1,num2){ var dice; dice = num1*((Math.floor(Math.random()*num2))+1); return dice; } 呼び出す時 var d100 = dice(1,100);

カスタムフィールドにテキスト、画像URL(メディアアップローダー使用)して独自データベースに登録してその内容を取得する

①カスタムフィールドの中身を独自データベースへ登録する ②カスタムフィールド内で画像を登録する際にメディアアップローダーを使用する ・メディアアップローダーを使用して画像のURLを独自DBに登録する ・画像登録は2箇所作りたい ③独自データベースは2個作りたい ④登録したカスタムフィールドの中身を取得してコンテンツ内に表示する ①はこちらの記事で取り上げた中身になります。 ②カスタムフィールド内で画像を登録する際にメディアアップローダーを使用する https://gist.github.com/sushat4692/33df8a65474798fca0c6 こちらの記事の方法を参考に、①の際に作ったカスタムフィールド&新規DBのソースと混ぜ合わせる必要があります。 「admin-media.js」がメディアアップローダーを使用してくれる動きをしてくれる。 「admin.css」これは今回使いません 「function.php」この中でカスタムフィールドを作成している部分があるが、カスタムフィールドを作成するところは①のプラグインとして作成してしまっているので、ソースの一部を参考する形になります。 1.「function.php」で画像の登録・表示処理をしている部分を、①のプラグイン「custom-meta-field1.php」に追記します。 function.phpにある[36行目]〜[50行目]を、プラグイン側の画像登録を表示したい箇所にコピペします。 プラグイン側のtableのtd内にコピペです。 <td> <div class="custom-media" data-type="image" data-title="画像" data-target="#field-image"> <input type="text" id="field-image" class="my-uploader__url widefat" name="street_img" value="<?php echo $str...

android4.2のwebviewでdocument.write();が使えない

ウェブページが表示される画面サイズによって自動的に数値を入れるjavascriptを作成したのだが、androidタブレットのアプリ内webviewで表示した時に見栄えがどうもおかしかった。 androidのバージョンを調べたところ、4.2だった。 どうやら、4.2だとCSS3が使えないとのこと…。 更に、document.writeが対応しないという記事も見つけたので、代替え案を模索。 document.write(s); ↓ document.getElementById("WinSize").innerHTML = s; とすることで、無事表示される。 HTML側では、 <div id="WinSize"></div> とすることで、解決しました!

googlemapsをiframeを使わないで表示する

■googlemapsをiframeを使わないで表示する 【HTML】 <head> <script src="http://maps.google.com/maps/api/js?v=3&sensor=false" type="text/javascript" charset="UTF-8"></script> <script type="text/javascript"> //<![CDATA[ var map; function map() { var latlng = new google.maps.LatLng(35.711783,139.796686); //緯度経度の初期値 var opts = { zoom: 17, //初期の拡大値(大きいほど拡大) mapTypeId: google.maps.MapTypeId.ROADMAP, center: latlng }; map = new google.maps.Map(document.getElementById("map"), opts); //id="map"のところに表示しますよー // Marker var markerOpts = { position: new google.maps.LatLng(35.711844,139.796444), //マーカーを表示する緯度経度 map: map, title: "マーカーですよー" //カーソルを合わせたら表示される文字 }; var marker = new google.maps.Marker(markerOpts); } //]]> </script> </head> <body onload="map(...

google analyticsで外部リンクをイベント取得し、別ウインドウ(target _blank)で開く

■通常のアナリティクスの記述に加えてこれを書く ■実際にリンクを貼る時 ※でもコレだと別ウインドウで開く為のtarget blankが効かない ※ちなみに、  XHTML 1.0 Strict では target = blank が利用できないらしい。 ■別ウインドウで開く方法 setTimeout('document.location = "' + link.href + '"', 100) の部分を setTimeout('window.open("' + link.href + '", "_blank")', 100) とすると別ウインドウで開けるようになった…。 でも、ポップアップブロックにひっかかる。 引き続き調査。 ポップアップブロックされた時に別ウインドウで開く方法 function openWindow( url,name,option ) {     if( !window.open( url, name, option ) ) {         location.href = url;     } } ■別ウインドウで開く方法その2 これは、scriptの方には何も書かなくていい方法…。試し中。 テストページ 別ウインドウでは開くから、無事イベントを拾ったら入れ替える予定

このブログの人気の投稿

Dreamweaver(ドリームウィーバー)でコピーができない。ペーストができない。

Dreamweaverでhtmlタグを綺麗にする設定(ソースコードのフォーマット)

bootstrap5 で「fs-md-1」 のように画面サイズによってフォントサイズを切り替えるcssを追加する