通常のテキストリンクをマウスオーバー時に、リンク感を更に出すアイディア
テキスト中に埋め込まれたテキストリンクでは、なんか物足りない。そんな時にこれを使うとぴったりかも
Bootstrapを使ってWEBサイトを作ってみようぜ 第7回 「コンテンツ部分とサイドバーを作る」
Bootstarapを使ってWEBサイトを初心者が作ってみるコーナー、今回は第7回目でメインエリアのコンテンツ部分とサイドバーの部分を作る作業です。
Tableのヘッダーが見えなくならないようにスクロールに合わせて常に表示されるように付いてくるようにするコード
テーブルのヘッダーの項目を常に表示できるようにするコード。これを使うことで、テーブルの途中で何の項目だったのか分からなくなってしまうのを防ぐことが出来る
WordPressで無限読み込み、無限スクロールが簡単に出来る様になるプラグイン 『Infinite Scroll』 の使い方
TwitterとかFacebookとかPinterestでスクロールをしていくことで次々とコンテンツを読み込んでいくことができます、あれをWordpressで簡単に実現することが出来るプラグインがあります HTMLとCS […]
ココナラにて広告掲載を試験的に募集開始します
当サイトの広告をいづればすべて純広告に切り替えたいと思っているのですが。 その第一歩として、当サイトのサイドバーの上部に純広告の掲載を試験的に開始いたします 今回はココナラからの購入を限定として、開始してみようかと思いま […]
WordPressで記事に付けられたカテゴリと、そのカテゴリにある記事数を自由にレイアウトする方法
記事に指定されているカテゴリを表示することは、当たり前なのですが。そのカテゴリに含まれている記事数を表示したい場合は通常 the_category を使うことが多いのですが、こちらは形式が決まっています。get_the_ […]
画面全体が切り替わるダイナミックな演出のナビゲーションのアイディア 『Full Page Intro & Navigation』
画面全体に表示されるナビゲーションへの切り替えがダイナミックな演出のナビゲーションの導入の例。CSS3での変形とアニメーションをうまく組み合わせて作られたナビゲーションです
WordPressでショートコードの中にショートコードを書けるようにする方法
WordPressのショートコード使っていますでしょうか？ ショートコードはビジュアルエディタのままで、コードを呼び出せるので 決まったコードを何度も使ったりする場合にはとても便利です でもそんなショートコ […]
WEBサイトの背景いっぱいに、YOUTUBEの動画を流すjQueryプラグイン 『jQuery tubular』
ホームページ等のWEBサイトの背景をYOUTUBEを使って動画にする方法。jQueryとプラグインを使うことで、簡単に導入することが可能。またYOUTUBEからの配信なので転送量を気にする必要がない
文字の部分をbackground-clip: text;を使って背景をGIF動画にして見せるテクニック
background-clip: text;をつかってテクニック。背景にGIF動画を設置することで、テキストに目を引きつけるのに効果的。
eo光で障害発生が多発？DNSの問題で閲覧できないサイトがある問題を回避する方法
私は関西在住です インターネットに使っているのはeo光の100Mbpsのプランです、光回線の100Mbpsのプランだけでも十分快適 なのですが、ここ最近eo光で障害の発生が多発しているようです。 ネット初心者はたぶん原因 […]
ココナラで、出品者ランクがポピュラーにランクアップしました！
ココナラを開始したのは、5月の初め頃ですが。 一ヶ月も経ってないですが、出品者ランクがポピュラーになりました 評価基準は、売上5件以上で評判が良い出品者ということで。一つの出品物でってことではなくて全体の出品の売上と評価 […]
要素を綺麗にブロック・レンガ状に並べてくれるjQueryプラグイン 『Masonry』
jQueryのプラグインで、自動的に要素を綺麗に整列してくれるプラグインです。 記事一覧や画像一覧等によく使われます。すべてが同じサイズの場合はCSSだけでなんとかなるんですが、そうは行かないケースも多々有ります。そんな […]
マウスポインターの位置に合わせて動くギャラリースライドがとても印象的 『Hover-Carousel』
Hover-Carousel Yair Even Or GIFアニメにしたもの マウスポインターの位置によって画像を、スマホとかでスライドさせるような感覚で操作できる印象的なスライド とてもめずらしい動作で […]
タグ要素一つだけで作れる、リボン見出しが作れる CSSコード 『Single Element Pure CSS3 Double Fold Ribbon』
Single Element Pure CSS3 Double Fold Ribbon http://thecodeplayer.com/walkthrough/single-element-pure-css3-doub […]
ヘッダー部分がスクロールすると、ついてくるナビゲーションに変化するアイディア
A Pen by Paul Howarth 通常の画像とロゴのヘッダーに見えたのが、スクロールをトリガーにヘッダーの画像をそのまま利用したナビゲーションに変化するアイディアです。 コードはHTML、CSS […]
Bootstrapを使ってWEBサイトを作ってみようぜ 第6回 「ヘッダー部分を作る」
第1回 「CSSフレームワークって何？」 第2回 「グリッドシステムって何？ グリッドシステムを学ぶ」 第3回 「セットアップして利用開始できる環境を作ろう」 第4回 「制作事例をみてイメージを膨らまそう」 第5回 「全 […]
記事の表示をモバイル向けには、省略形で表示するアイディア 『Mobile Friendly Reading v2.0』
Mobile Friendly Reading v2.0 By Justin レスポンシブデザインでモバイル向けには、テキスト部分を、徐々に文字が薄くなっていくエフェクトを使って省略表示したアイディアです。 […]
すごすぎるVelocityJSを使った、HTML+CSS+jsで作ったアニメーションのデモ 『VelocityJS demo』
カッコイイのひとこですね。 簡単にはこのレベルのアニメーションはVelocityJSというプラグインを使っても作れないでしょうが。チャレンジはしたくなりますね。
rotateを使った三角形のマウスオーバーエフェクト 『List with arrows <』
要素をマウスオーバーした時に、背景色の変化と三角形が現れるエフェクトを与えたものです。
