サクサク読めて、アプリ限定の機能も多数!
トップへ戻る
デスク環境を整える
entereal.co.jp
Greasemonkey (グレースモンキー)とは Greasemonkeyとは、Google Chromeや、Firefoxなどの主要ブラウザに対応するアドオンで、各種WEBサイト上で任意のJavascriptを実行するためのアドオンです。 https://addons.mozilla.org/ja/firefox/addon/greasemonkey/ 各種WEBサイト上でJavascriptを実行する事で、HTML要素や機能、CSSのスタイル等を自由にカスタマイズが出来ます。具体例としては、以下のような事が可能です。 WEBサイト上の広告や不要要素を表示しなくする 使用端末の画面サイズに合わせて各要素のサイズを調整する WEBサイト内のデータを整形して表示する WEBサイト内の外部リンクを全て取り出す WEBサイト内の任意の単語にフリガナをつけたり、意味を表示するリンクを付ける スク
get テーブルのプライマリーキーを指定して1件のデータを検索する時に使用 // MODELから同モデルを読み込む場合 $result = $this->MODELs->get($id); // 他のモデルを読み込む場合 use Cake\ORM\TableRegistry; $class = TableRegistry::get('Xxxx'); $result = $class->get($id); find テーブルのデータを全件又は、絞り込んで検索する時に使用 ※ CakePHP2から若干変わって、QueryBuilderを使う // MODELsController.phpから同モデルを読み込む場合 $results = $this->MODELs->find(); // 他のモデルを読み込む場合 use Cake\ORM\TableRegistry; $class = Tabl
Bootstrapでレイアウトデザインをするにあたって、必要な情報を分かりやすくまとめてみました。 この内容は、本家Bootstrapのサイトにも載っていますが、英語が苦手な方、使うのになれていない方をターゲットにわかりやすく噛み砕いて説明する事を目的にしています。 Bootstrapでのレイアウトの基本 Bootstrapのグリッドの機能を使ってページレイアウトをする際には、「固定幅レイアウト」と「リキッドレイアウト」の2通りの基本レイアウト方法を選ぶ必要があります。 Bootstrap的に言うと、<div class="container"></div>と、<div class="container-fluid"></div>のどちらを使うのかという事なのですが・・・。 固定幅レイアウト (container) ブラウザウインドの幅に応じた固定の幅がデフォルトで決められていて、それを元
// 上記インプット要素に対し // 下のJSを実行するだけ <input type="text" class="form-control" id="Date"> // $('#Date').datepicker(); オプション設定 上記のサンプルはオプションを一切設定せず、デフォルトのままです。 デフォルトのオプション設定では、ほとんどが英語表記になっていますので、日本人ユーザのために日本語表記に変える部分を中心に記載します。 詳細は、(英語ですが)本家ページをご参照ください。 http://api.jqueryui.com/datepicker/ ここでの設定値 $('#Date').datepicker({ dateFormat: 'yy/mm/dd (DD)', yearSuffix: '年', showMonthAfterYear: true, monthNames: ['1月
はじめに WEBサービスを提供する際、どんなユーザがどこから、どんな端末でアクセスしてきているかを分析する事は、次の戦略を考える上で非常に有効です。それを実現するのがGoogle Analyticsをはじめとする、アクセス解析ツールですが、WEBページの解析に特化していて、WEBアプリやWEBページの機能内で使う事は難しいです。 そこで、今回は、サーバ側で取得したユーザ(クライアント)IPアドレスを元に、各種APIを使用して詳細情報を取得する方法について書いてみます。 IPアドレスの仕組み インターネットの世界で現状主力として使われているIPアドレスは、国際的な規約によって、各国に範囲毎に配布されています。例えば10.xxx.xxx.xxx〜11.xxx.xxx.xxxの範囲は○○国に割当てと、いう感じ。その範囲が、各国内で企業や団体に順次配分される仕組みである。 このルールや、割当実績情
Bootstrapのタブの機能を強化する方法です。 なかなか、言葉で説明しにくいですが、Bootstrapを使用して作られたあるページ内にタブがあったとします。そのページを開いた時class="active"が設定されたタブやそのコンテンツが表示された状態になっています。
Datepickerで土日や祝日、定休日等に色をつけたり、選択できなくしたりする方法をご紹介します。 Datepickerを使う時は、かなりの頻度で必要になるのではないでしょうか? 概要 beforeShowDayは、DatePickerが設定されたフィールドが選択され、カレンダーが表示される前にその月の日数回実行されます。 毎回、引数にDate型の日付を引数として受け取りますので、それを使って判定し結果を戻します。 今回の場合、配列に設定した祝日リストと比較し、一致する場合は、祝日と判定しています。 判定結果によって、3つの値を持った配列を結果として戻します。[true/false, '文字列', '文字列']
はじめてのownCloud ownCloudは、Dropboxに代表されるオンラインストレージを実現するためのオープンソースソフトウェアです。 Dropboxの基本機能は、全てがこれで実現可能です。 さくらのレンタルサーバの容量が増強され、サーバ容量余裕が出たため、まずは実験目的にインストールしてみる事にしました。 注意事項 実際にインストールする前に検討ならないことが幾つかあります。しっかり検討してから使用してください。 セキュリティ問題 これは、どのオンラインストレージサービスでも同じですが、各種データをクローズされたローカル環境から、インターネットに接続されたオンライン環境へアップロードする事になります。当然暗号化やパスワード等の対策はあるものの、その全てを行ったとしても情報漏えいのリスクをゼロにすることはできません。 格納予定データの種類などを加味し、これによる効率化とリスクのバラ
最近、固定回線、モバイル回線等の接続速度が速くなり、昔の56kや64kbpsの頃のように画像のサイズやページの表示レスポンスに気を使う事が少なくなりました。今や普通のブログ等であれば、体感で1秒あれば表示が出来る時代です。 でも、ひとたび、高精細な画像や、Youtube動画などを複数並べるページになると、まだまだ環境的に厳しい方も多いと思います。 そんな時、制作側で出来る事というと、まずは画面に表示されている画像だけを先に読み込んで表示し、それ以外は、スクロールして画面に表示された段階で読み込むなど、体感速度を上げる方法が一般的です。 よく出来た Lazy Load Plugin for jQuery その手のスクリプトで一番使われているのは、おそらく「Lazy Load Plugin for jQuery」では、無いでしょうか? 使い方も簡単で、jQuery本体と、ダウンロードしたjqu
ただ、この現状だと幅が768ピクセル未満は全て同じと見なされるので、iPhoneの縦と横で同じレイアウトになってしまいます。 そのため現状だと、@media only screen and (min-device-width: 320px) and (orientation: portrait) { /* CSS Here */ }など、メディアクエリで対応するしかないのですが、もっと簡単にレイアウトできればということで調べたところ、もちろんBootstrap側でカスタマイズ出来るオンラインルーツが用意されていました。 ※ Customize and downloadのページから自由なブレイクポイントでカスタムしたCSSが作れます。 でも、これをパッと見て理解できる人は多くはないハズ。ですよね。 ということで、簡単に実現する方法として、480pxでもう一つブレイクポイントを作ることができる
Blog Posts List ブログ記事一覧 検索 CakePHP3を始めた方に CakePHP 3.X 2016年01月16日(土) 14時23分 2つの住所から距離を計算する API 2015年12月18日(金) 10時23分 「:target」セレクタについて CSS 2015年12月12日(土) 12時23分 外部サイトからの画像への直リンクを防ぐ Apache 2015年12月04日(金) 12時23分 CSS3だけで作るブラウザタブ CSS 2015年11月17日(火) 21時23分 CSS3だけで作るパンくずに関する件 CSS 2015年11月12日(木) 12時23分 Bootstrap4のブレイクポイント計算機 Bootstrap 2015年11月11日(水) 19時23分 Bootstrap4のブレイクポイントに関する件 Bootstrap 2015年11月11日(水
{wrap} Bootstrap Bootstrapでそのまま使えるHTMLとCSS、素材セットを紹介しています。テンプレート自体は少額有料ですが、デザイン性が高く結果的に安上がりかも。 https://wrapbootstrap.com/ BootstrapStyler Bootstrapでそのまま使えるHTMLとCSS、素材セットを紹介しています。無料でダウンロード出来る点が非常に嬉しいです。 http://bootstrapstyler.com/
まえおき WEB製作を担当させて頂いたあるお客様からのご要望だったのですが、なかなかタイトルだけでは、内容の想像が難しいため、まずは画像をご覧ください。 「画面上部から下にスライドダウンするメニュー (図1から図2へのような)」を、モバイルアプリで人気の「左からのスライドインするメニュー (図3から図4へのような)」にしたいのです。 ちなみに、本サイトも同様になっております。おそらくそれをご覧になってご相談下さったのではないでしょうか? まずは まずは、フリーで提供されているjQueryのプラグインを探します。 今回は、Alberto Verela氏の「Sidr」を使用しましたが、同様のプラグインは複数存在します。 Snap.js PageSlide jPanelMenu Sidrの基本的な使い方 本家サイトから「sidr-package-1.1.1.zip」をダウンロードし、アーカイブを
手前ミソですが。。。 本記事を書いてからしばらく経ちましたが、この辺りに興味がある方が多いようで、引き続き高アクセスが続いています。 BootstrapもVer3.xがリリースされた事から、もっと簡単にスライドメニューを追加できる専用プラグインを作成しましたので、良ければそちらもご参照下さい。 前回:「Sidrの基本的な使い方」へ Bootstrapへの最適化 前回終わりのサンプルを見て頂くとわかると思いますが、メニュー用に用意したHTML要素が「#sidr」というid名でコピーされ、画面左からスライドインしてくる仕様です。 なので、このまま使う場合には、用意したメニューリスト(サンプルでは「#navigation」)を別途cssで非表示にしてあげる必要があります。Bootstrapに組み込む場合は初期状態で非表示になっているため必要ありません。 ※id名を変えずに「#sidr」とした場合
このページを最初にブックマークしてみませんか?
『entereal.co.jp』の新着エントリーを見る
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く