手作りのスクリプト集

写真ギャラリー

各種サイトで使用しているスクリプトを整理している。2013年にTwitter Bootstrapを学習し、各種サイトで使い出したが、複雑で使いにくく、サイズも数百KBを超えるようになった。各ページで使うスクリプトは数種くらいなので、あれもこれも備えたBootstrapを使うと冗長があまりにも大きすぎ… 続きを読む

今日は何の日?

Web制作にPerlを使うことが多かった時代に「今日は何の日?」という無料スクリプトを見つけて設置した。いまも有効だが自宅サーバにPerlがないので簡単な機能のスクリプトをJavascriptで作成した。過去のx月x日に撮った写真を表示するスクリプトである。元のデータは下記の形式で作成し、thumb… 続きを読む

getElementById

document.getElementByIdを使った例 var jpg = new Array("/assets/img/m/001.jpg","/assets/img/m/002.jpg","/assets/img/m/003.jpg"); var img = new Array(); … 続きを読む

facebookボタン

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

ポップアップ

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

パスワード保護

限定公開のページをつくる方法はいくつかある。いちばん簡単なのは、HTTPサーバ認証の仕組みを利用してディレクトリ全体を保護することだろう。サーバのファイル保護機能で設定するか、テキストエディタで.htaccessを作成してアップすればよい。PHPスクリプトで保護することもできる。一度認証するとブラウ… 続きを読む
撮影した動画を編集するときにBGMを追加したいが、著作権フリーの素材が少ないので苦労する。著作権が切れた50年以上前の楽譜であっても、演奏権などの問題が残る。演奏権も切れた50年以上前の音源は品質が悪いという問題がある。著作権フリーで配布している個人サイトがあるがmidiファイルのため、動画編集ソフ… 続きを読む

Google Maps API

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

CSS Selector

h3.example { margin:1em 0; font-size:18px; } p { font-size:16px; margin:1.5em 0; padding:0; } .change, .toggle { cursor:pointer; } .change:hov… 続きを読む

scoped

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

MT Template

テンプレートを新規に作成中。標準テンプレートは汎用性を追及しているため、冗長度が高く、3重4重の入れ子になっており複雑で使いにくい。自分の目的にあった、分かりやすく作業がしやすいテンプレートと構成にする。スタイルも自分の標準としていくつか作成する。… 続きを読む

JQuery Tabs

かつてBBC Newsで使っていたスクリプトを入手して利用。tabs.jsに含まれていた古いJQueryを削除し、Bootstrapで使っているJQueryを共用できるようにした。 tabs.js はおよそ9KBと軽量である。インラインのスクリプトの#areaTabsを変えて複数のTabsを同じペー… 続きを読む

Bootstrap Tabs

Twitter Bootstrapのトグル・タブの例である。JQueryで書かれている。IDを変えて、インラインのJQueryを書けば、複数かけるかも知れないが、確認していない。 One Two Three One <link href="/assets/css/bootstrap.css"… 続きを読む

CSS Menu

CSSでメニューリストをつくる。 #menu ul{margin: 0; padding: 0; list-style: none;} #menu li{ display: inline; padding: 0; margin: 0; float: left;} #menu li a{displa… 続きを読む

新規スタイル作成

新しいテーマ/スタイルを作成し、自分好みのthemesファイルをつくる。MTスタイルは汎用性を追及しているので冗長が多い。そのため属性定義が重複していたりするので、カストマイズしにくく時間がかかる。これをもっとシンプルにして後で引用しやすくする。 最初はもっともシンプルなPicoテーマを採用 テキス… 続きを読む

Memoサイト移行

各種ページ作成のメモ帳 /memo/ は古いMT4.25で作成している。これを MT6 に移行することを検討中。 とりあえず /memo/ を MTツールでエクスポートしたテキストファイル(60記事、最終記事2/21)を /assets/memo/ にインポートした。 4/28時点では、テンプレート… 続きを読む

MT見直し

Movable Typeを使いはじめて10年が経った。MT3~MT6が混在しており、ドメインも5つにわたっている。作成したブログは20件以上になっている。そのほとんどが休眠状態だ。主力だった「人生は冒険か無か」というのは2011年3月に停止したままだ。ここ数年は、Drupalを採用した「飛耳長目」に… 続きを読む

PHP Authorize

〔例〕ユーザ名test パスワード1234 ユーザ名: パスワード: <form action="<?php echo $_SERVER['PHP_SELF']; ?>" method="POST" enctype="application/x-www-form-urlenco… 続きを読む

自宅サーバ

QNAP TurboNAS自宅サーバ(QNAP QTS4.0.5)を構築した。NASファイルサーバおよびWEBサーバとして利用できる。ローカル/モバイル共用、複数端末からのアクセスを可能にすることが目的である。  Remote Access: sigmasns.myqnapcloud.co… 続きを読む
アーカイブインデックス archives.html のリンクがローカルでも機能するように、絶対URLを相対アドレスに変更した。エントリーアーカイブ <$MTEntryPermalink$>→ カテゴリ別 <$MTCategoryBasename$>/<$MTEntryB… 続きを読む