ブログ

facebookボタン Scripts&Styles  2014年6月24日

Facebook APIの各種ボタンを整理中数年前は開発者向けドキュメントで分かりにくく、APIも変更されることがあった。いまは、Social Plugins に集約され、分かりやすくなっている。プラグイン・コードは、HTML5, XFBML, IFRAME, URLから選択でき

ポップアップ Scripts&Styles  2014年6月18日

Webページを作っていると欲がでてきて、縮小画像にカーソルを重ねると別の画像が表示されたり、クリックすると小窓が飛び出して別のページが表示されたりする動きや対話性があるページを作りたくなる。HTMLファイルの数を少なくできて管理しやすいという利点もある。 とくに写真を整理するとき

MTEntries MT6学習  2014年6月17日

投稿記事の一覧(概要)を表示するときに使う。対象とするサイトおよびブログを指定できる。 〔例〕 mtentries <mt:Entries lastn="10"> <mt:EntriesHeader> <div class="widget

MTIfNonZero MT6学習  2014年6月17日

Professional Website 1.1の標準テンプレートで下記のタグがある。<mt:IfNonZero tag="BlogEntryCount" include_blogs="children" include_with_website="1"> 調べたらM
限定公開のページをつくる方法はいくつかある。いちばん簡単なのは、HTTPサーバ認証の仕組みを利用してディレクトリ全体を保護することだろう。サーバのファイル保護機能で設定するか、テキストエディタで.htaccessを作成してアップすればよい。PHPスクリプトで保護することもできる。
撮影した動画を編集するときにBGMを追加したいが、著作権フリーの素材が少ないので苦労する。著作権が切れた50年以上前の楽譜であっても、演奏権などの問題が残る。演奏権も切れた50年以上前の音源は品質が悪いという問題がある。著作権フリーで配布している個人サイトがあるがmidiファイル

Google Maps API Scripts&Styles  2014年6月 9日

KMLファイルをグーグル地図上に表示するスクリプトなど便利なAPIが無料で提供されている。いくつか勉強してサンプルを作成した。 Geocode Elevation along a path KML Layer Panoramio Tags Places Weather Polyg

accordion Bootstrap  2014年5月28日

アコーディオンのようにひとつのメニューが開き、ほかのメニューは閉じる。ブラウザで開いたときにメニューも開くときは、accordion-body collapse in と書く。 〔例〕アコーディオン名 side-bar グループ名area01~area03 概要 Link1

CSS Selector Scripts&Styles  2014年5月28日

h3.example { margin:1em 0; font-size:18px; } p { font-size:16px; margin:1.5em 0; padding:0; } .change, .toggle { cursor:pointer; } .

Clean Energy Bootstrap  2014年5月24日

クリーンエネルギー、持続可能なエネルギーを代替エネルギーと呼ぶ。その長所と短所を一つずつしっかりと見る。確かな数字があってこそ説得力がある。 太陽光エネルギー 1平方キロmあたり 1kw 1W 懐中電灯 100W 人間が発する熱エネルギー 1,000W=1KW    小さな家 1

Responsive Navbar Bootstrap  2014年5月23日

a collapsing responsive navbar を試作した。クラス.nav-collapse.collapseのDivに書いた内容が、スマホ(幅940px以下のウィンドウ)で隠れて、替わりにnavbar toggle button (.btn-navbarに書く)が

Responsive Web Bootstrap  2014年5月23日

Windows, Android, iPhoneなどの端末の仕様に対応するようにWebページを設計することをレスポンシブ・ウェブ・デザインという。MTテンプレートでは、これを実現するのは困難である。ページレイアウトで横幅が固定されたテンプレートが標準になっているからである。MT6

Glyphicons Bootstrap  2014年5月22日

無料で取得できるGlyphiconが、Bootstrapでも標準として使える。過去に作成したアイコンを glyphicon.css に追加した。大きいサイズのアイコンも追加した。すべて&ly;i>タグで引用する。大きいサイズは<i class="icon-glass

Images Bootstrap  2014年5月22日

写真の一覧(サムネール)、ポップアップ拡大表示、スライドショーなどには、Fancyboxを改造したfbox.jsを使う。本文に埋め込む画像の体裁は、BootstrapにあるCSSを使う。 HTMLコード <div class=""> <img src="/ass

Flowplayer Bootstrap  2014年5月22日

晩秋の向日葵 HTML <div class="flowplayer color-grn" data-ratio="0.5625"> <video poster="/video/001.jpg" src="/video/001.mp4" controls

LabelとBadge Bootstrap  2014年5月22日

異なるのは形状だけで、使い方はおなじで、両方ともinline-blockになる。いずれもdefault, success, Warning, Important, Info, Inversの6色だが、自分好みに変更・追加できる。

Navigation Bootstrap  2014年5月21日

このサイトで使っているナビゲーションメニューのCSSとHTMLの例基本スタイルはBootstrapで、MT標準スタイルシートは無効にした。

Button Bootstrap  2014年5月20日

Basic one two three <div class="btn-group"> <button class="btn">one</button> <button class="btn">two</butt

Tooltip Bootstrap  2014年5月19日

a.tips{color:maroon;font-size:18px;text-decoration:none;border-bottom:dotted 1px grey;} <a href="#" rel="tooltip" title="~"> カーソルを重ねる

scoped Scripts&Styles  2014年5月17日

HTML5で、<style>に scoped 属性が追加された。待ち望んだ機能である。<body>のなかに<style>が書けるようになったのである。スタイルを検討するときは、HTMLとCSSを書いて、FTPでアップし、ブラウザで開いて確認する

ブログ

Bootstrap
Drupal
Help
HTML試作
Memo
MT6学習
PHP学習
Scripts&Styles

最近の記事

試験2 HTML試作  2014年5月16日
test HTML試作  2014年5月16日
test HTML試作  2014年5月16日