サクサク読めて、アプリ限定の機能も多数！
トップへ戻る
Pixel 10
moshimoworks.com
WordPressのカテゴリー選択（複数選択）を単一選択にさせる方法3つ。 Continue reading → 2013年2月1日 by moshimo | 1 Comment WordPressの投稿画面では、カテゴリー選択は通常は複数選択が可能になっていますが、サイトでの使い方によってはあえて複数選べないほうが良い、単一選択のほうが便利なことがあります。その際に使える方法を調べてみました。 以下の例はどれもテーマのfunctions.phpに書けばOKです。 カテゴリーをラジオボタン化（jQueryでinputを書き換える） jQueryでカテゴリー選択の部分をチェックボックスからラジオボタンに書き換える手軽な方法。 function my_print_footer_scripts() { echo '<script type="text/javascript"> //<![CDA
他のブラウザでは問題なく動くけど、IEだとうまくいかない件。 jQueryのフェードイン・フェードアウトでもありました。 これはフェード効果を与えたい部分のスタイルにpositionを指定していると起こる模様。fadeIn()やfadeOut()しても、IEだとぱっと表示・非表示が切り替わるだけになってしまいます。 回避するにはフェード効果を与えたい部位にpositionを指定せずに組めるやり方があればそれで組む、ってところでしょうか…。使いたいですけどね、position。
LightBox風の表現で、枠の幅と高さを指定し overflow-y:scroll などとした時に、ふつうはスクロールバーが出るようになるのですが、iPhoneやiPadではスクロールバーが出ないようです。 iPhone、iPadでのoverflow:scroll/autoの動作について の解説がとても参考になりました。 iOS4まではoverflowを指定した領域内ではスクロールバーは出ないが、スクロール操作は「２本指」で行える iOS5からはスクロール操作は「１本指」で行えるようになったが、相変わらずスクロールバーは出ない なるほど、そうだったのか。 skroll というjQueryプラグインが紹介されていたので、これを使って縦スクロールバーを明示的に表示するようにして解決。見た目がiOSのスクロール表示（右端に細い線が出る）にそっくりです。iOSだけでなく、PC向けにも最適化され
wpautop()による自動整形を抑制する方法まとめ。 2012年8月24日 by moshimo | 0 comments WordPressでHTMLコードを含む投稿で良く問題になる、自動整形（wpautop）を抑制する方法をまとめてみました。 プラグインと、PHPコード記述の両方です。 プラグイン それぞれ特色があるので場合に応じて。 スイッチで一律適用したり、特定の記事だけカスタムフィールドの値を見てオン・オフしたり、ショートコードで範囲を決めたり、など。 PS Disable Auto Formatting WPAutop Control TRUEedit Raw HTML PHPコード 特定の表示だけピンポイントに（特定のPHPファイルにて） //the_content()の前などで remove_filter('the_content', 'wpautop'); 一律で抑制
Wake On LAN（ネットワーク経由でマシンを起動させる技術）を試してみたくなり、その結果をいくつかまとめてみます。 環境： MacBook Pro (OSX 10.6) iMac ちょっと古いの(OSX 10.6) フレッツ光（ブロードバンドルータ RV-230SE） MacでのWake On LAN まずMacでは、Wake On LAN（以下WOL）といっても完全に電源を落とした状態のものをネットワーク経由で起動できるわけではなく、スリープモード中のマシンを起動できるという制限があるようです。まあ制限といっても普段からスリープ→解除で使うスタイルが当たり前なのでこれは特に問題なし。 また、WOLは通常は有線LAN経由でしか利用できないようですが、MacではWiFiでWOLが可能で（技術的にはBonjourと組み合わせて…とかそんな感じだったとおもう）それをWake On D
bxSliderはいわゆるスライダーやカルーセルといった、特定のエリア内に複数のコンテンツ（スライド）を切り替え表示するものを作るのに重宝するjQueryプラグインです。 そのbxSliderを、画面幅いっぱいにスライドを並べる「ビューライン」形式で、画面幅可変、ループ表示に対応する設定についてです。 HTMLの組み方 これはいつもどおりに、例えばULで組みます。 <ul id="slider"> <li><img src="img/slide1.jpg" width="250" height="300" /></li> <li><img src="img/slide2.jpg" width="250" height="300" /></li> <li><img src="img/slide3.jpg" width="250" height="300" /></li> <li><img
前提として、文字列から文字を1文字拾って変数cに代入。条件が合致したら半角、そうでなければ全角です。 半角文字列を列挙してチェックする if (' !"#$%&\'()*+,-./0123456789:;<=>?@ABCDEFGHIJKLMNOPQRSTUVWXYZ[\\]^_`abcdefghijklmnopqrstuvwxyz{|}~'.indexOf(c) >= 0){ ... } キャラクターコードでだいたいの範囲を示す 変数cには文字列からキャラクターコードを取得しておきます。 var c = str.charCodeAt(i); ざっくりと256未満と、半角カナ文字の範囲を指定。半角カナの範囲が 0xff61 〜 0xff9f。 if (c < 256 || (c >= 0xff61 && c <= 0xff9f)) { ... } もうすこし細かく範囲を示す これも変数cにキ
jQuery Mobileを使ったアプリを作ってみてイベント周りでこんがらがってしまった経験から、複数ページテンプレートと単一ページテンプレートそれぞれで、ページ系イベントの挙動を確認してみました。 準備 まずページを3つ用意。 複数ページテンプレなら#page1, #page2, #page3。 単一ページテンプレならpage1.html, page2.html, page3.html という具合。 参考：ページ機構 | jQuery Mobile リファレンス そしてイベントを受けてconsole.logでイベント名を吐くだけの共通スクリプトを用意。 イベントを$(‘div[data-role="page"]‘).live(function(){…})で受ける。 ※ただし、pagebeforeload, pageload, pagebeforechange, pagechan
jQuery Mobileはスマホ対応するときにとても便利なフレームワークですが、ダイアログのスタイルを使うと少々残念な結果に。使ってみて「え…そうなんだ…」と思った人も多いのではと思いますが、ダイアログのまわり（背景）は透過ではなく、ただの背景色。 元画面の上にポップアップしてくれるわけではないんですね。 どうしたものかと悩んでいたら、海外のナイスガイがこれの素晴らしい解決策を書いてくれていましたので紹介します。 （jQuery Mobile 1.1で確認） まずはCSSから。 ダイアログの背景色を透過にするためにクラス毎にopacityに適切な値を設定。 .ui-dialog-background { opacity: 0.5; display: block !important; -webkit-transition: opacity 0.5s ease-in; } .ui-d
スマートフォン用のメディアクエリー（Media Queries）の指定を調べたときのまとめです。 まずはお約束。 <meta name="viewport" content="width=device-width,initial-scale=1.0" /> device-widthを指定して、ビューポート（仮想の画面領域）の幅と実際の画面幅を一致させます。 iPhoneの場合、3GSまでならここは320pxを指定するのと同じ。iPhone 4以降ならRetinaなのでデバイス幅と言うなら本来は640pxになるところですが、互換性を取ってこれも320px。つまり width=320 でもいいってことですかね。 次はメディアクエリーの記述。 @media only screen and (-webkit-min-device-pixel-ratio: 2) { /* iPhone Retin
jQueryでselectまわりをいじるときのまとめです。 基本 選択項目の値を取得する。 $('select').val(); //短い書き方 $('select option:selected').val(); 任意の項目を選択する。 $('select').val('hoge'); //optionのvalueに相当する値を代入 選択項目の変更を察知する。 $('select').change(function() { alert( $(this).val() ); }); 選択項目を変更し、かつ変更イベントをトリガーする。 $('select').val('hoge').trigger('change'); 応用 表示項目を切り替え プルダウンリストの項目を操作して状況に応じて表示項目を切り替えたい。 ここでは#fooは対象のselect要素。class=”bar”のoption
こないだ仕事で使った組み合わせ。 Limonade（Lemonadeではない）はSinatraに影響を受けたらしいPHP用の軽量フレームワーク。IdiormはPDOベース。どちらもシンプルでプロトタイプ作りに適している。覚えることが少ないから学習も簡単。IdiormをベースにしたORマッパー、Parisはまだ使ってないので後で確かめたい。 Limonade – PHP micro-framework Idiorm and Paris – object relational mapper (ORM), fluent SQL query builder and Active Record implementation for PHP 以下はlimonadeでidiormを使うときのメモ。 接続設定やエラーモードの指定などを、index.phpのconfigure()に記述。 require
前回書いたとおり、tanzakuテーマ（企画デザイン TRIPLESHIPS Inc.）をネタに何かひとつやってみようということで、tanzakuのカスタマイズとしてHTML5化を、HTML5を勉強しながらやってみました。タグの取捨選択でまだマークアップに迷いのあるところもありますが、こんな感じでしょうか？（最後に改造ファイルへのリンクあります） 変更箇所 まずはお決まりの、はじまりの文書タイプを変更。 [html] [/html] 古いIE向けに html5.js を呼び、 [html] [/html] CSSでは article や header, footer などの新しいブロック要素を display:block; にしたりなどの処理を付け足します。 [css] article,aside,canvas,details,figcaption,figure, footer,
We build to last. Crafting digital solutions that stand the test of time, we build with precision, passion, and a commitment to enduring excellence. About Us Who We Are We are a team of digital enthusiasts, passionate about turning ideas into exceptional online experiences. Discover the creative minds behind your digital success. What Our Goal Empowering your digital success is our mission. Our go
このページを最初にブックマークしてみませんか？
『Moshimoworks.com』の新着エントリーを見る
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
