CSSでfloatを解除する方法のまとめ
CSSのfloatを解除（クリア）する方法をまとめてみました。 以前、floatを解除するテクニックとして以下の記事をエントリーしたのですが、その後色々なテクニックがあることに気がつきました。 CSS の after 擬似要素で回り込みを解除する ということで、そもそものfloatの問題（というか仕様）と、その対処方法についてネットで調べた情報を一通りまとめました。 １．floatにより親要素の高さが出なくなる（＝背景がなくなる）問題 親要素の中にある子要素にfloatプロパティが設定されていると、内容をもたない親要素の高さが0になるという仕様になっています。 例えば、次のCSSとHTMLを例にします。 <style> #container { width: 200px; background: #ddd; } .box { width: 25px; margin: 10px; paddi
YouTubeを効果的に見せるための12の隠しパラメータ
YouTubeの動画をブログに貼り付けるときに次のようなiframeタグを利用するのはご存知かと思います。 <iframe width="470" height="269" src="http://www.youtube.com/embed/YDxYmhze5Do" frameborder="0" allowfullscreen> </iframe> このiframeタグに隠しパラメータ（隠されている訳ではありませんが）をつけることで見栄えや動作を変更することができます。 以下の動画はパラメータを付与してみたものです。テーマおよびプログレスバーの色の変更して、セピアカラーの動画にマッチしたデザインにしています。再生後の関連動画の非表示や再生開始位置の変更なども行っています。 ということで以下、隠しパラメータの紹介です。すべてのパラメータは、次の設定例のように、src属性に設定したURLの末
WordPressでウィジェットを作るカスタマイズ
「WordPress 3のサイドバーにウィジェットを表示するカスタマイズ」の続きで、WordPress 3でウィジェットを作るカスタマイズを紹介します。 １．基本 ウィジェット作成に必要なソースコードは次のようなイメージです。 class WP_Widget_xxx extends WP_Widget { function WP_Widget_xxx() { } function form( $instance ) { } function update( $new_instance, $old_instance ) { } function widget( $args, $instance ) { } } function WP_Widget_xxxInit() { register_widget('WP_Widget_xxx'); } add_action('widgets_init'
TwitterやFacebookのように一番下までスクロールしたら自動的にコンテンツを表示する「jQuery.Bottomプラグイン」
TwitterのタイムラインやFacebookのニュースフィードように、ページの一番下までスクロールしたらコンテンツを自動的に表示する「jQuery.Bottomプラグイン」を紹介します。 １．サンプル jQuery.Bottomプラグインにはデモページが用意されていますが、いまいちなのでサンプルページを作りました。 jQuery.Bottomプラグインサンプル ページの一番下までスクロールすると自動的にコンテンツを表示します。 なお、最初に表示した状態でコンテンツがすべて表示されてしまっているとそもそも動作しないので注意してください。 ２．プラグインの機能 jQuery.Bottomプラグインは「bottom」イベントを登録するためのものです。このイベントを利用してページの一番下までスクロールすれば、bottomイベントが発生します。 ３．プラグインのダウンロード githubのjQue
Facebookページでノートを利用する
Facebookのノートは、ブログのようにちょっとした記事を書くために使うものです。 が、Facebookページ作成直後のメニューには「ノート」のタブがありません。Facebookページ作成直後の左メニューに表示されるのは「ウォール」と「基本データ」の2つだけです。 ということで、Facebookページで「ノート」を利用する方法を紹介します。 １．ノートを追加する Facebookページのウォール画面または基本データ画面の右上にある「Facebookページを編集」をクリック。 「アプリ」をクリック。 「ノート」の「設定を編集」をクリック。 中央の「追加」をクリック。 表示が「追加済み（削除）」となったことを確認して「OK」をクリック。この時点で「ノート」がメニューに追加されます。 追加されたことを確認するには、画面右上の「Facebookページを見る」をクリックして、Facebookページ
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
