This domain is for use in illustrative examples in documents. You may use this domain in literature without prior coordination or asking for permission. More information...
HTML5 and CSS3 web development has pushed the boundaries of what is possible online. Modern browsers have also jumped aboard the bandwagon to support a multitude of these newer effects. As a designer I have been amazed to find crazy CSS-based projects online. Open source is driving the future of websites and how we design layouts. In this gallery you’ll find 28 brilliant samples of CSS-only codes.
一度書いたコードは二度と探さない!スニペットを究めて快適コーディング!【HTML, CSS, JavaScript】 ※この記事は2013年8月26日に執筆された記事です。現在は仕様が異なる可能性があります。 気がつけば繰り返し同じ単語で検索し、同じコードを書いている…なんてことはありませんか?「この部分の記述、もう一回使うことがあるかも」と思ったらぜひスニペットとして登録しておきましょう! スニペットとは繰り返し登場するコードの断片、またはそれをすぐに呼び出せるように管理するエディタの機能のことです。自分がよく使用する記述をスニペットにしておけばいちいち検索したり、昔書いたソースを探ってみたりすることなく、使いたい時に正確な記述をサッと呼び出して使うことができます。 Dreamweaver、Sublime Textなどのオーサリングツールやテキストエディタにはスニペットを自在に使うための
Bootsnipp Design elements, playground and code snippets for Bootstrap HTML/CSS/JS framework What is this? Bootsnipp is an element gallery for web designers and web developers, anybody using Bootstrap will find this website essential in their craft. Stay updated, Subscribe to Bootsnipp mailing list (only important updates will be sent, your email is never shared or sold to anyone else)
新着情報などにNewマークを表示させたいなどの要望はよくあることですね。 今回は、表示する記事が新着や更新かどうかの判別用コードを紹介します。 なるべく汎用的となるように書いたので、ちょっとコードが長いですが、ご容赦ください。 いつものように CODE 1 を利用するテーマの functions.php にぺたりと追加してもらえれば、新着や更新の条件判別ができるようになります。利用方法は、コードの後で。 CODE 1 /** * post_classの出力するclassに、新着であれば、new-post、更新であれば、modified-postを追加する。 * * @param array $classes Array of default classes. * @param array|string $class array or string space separated class
コーポレートサイトでよくありがちなのが、新着情報タイトルをトップページに表示させるってやつで、 言わずもがなget_postsでちょちょいとやるわけなんですが、こういう感じのサイトもよくあるよね。 ↓ 冒頭のアイコンっぽい部分は投稿タグを出力。CSSでそれっぽくスタイリング。 タグごとに色分けしたいから、それぞれのタグをあたりで囲んで、タグごとにユニークなclassを付ける、というのがやりたいこと。 この手の質問は過去にフォーラムでも挙がっていたのだけど、 WordPress › フォーラム » 単一記事のタグにそれぞれクラス指定をしたい WordPress › フォーラム » 単一記事のタグ、カテゴリにクラス指定をしたい まー正直、どれも[解決済み]になってないし、まったくもってしっくり来ない。 日本語のブログではなかなか情報が見つからない。 日本語でダメなら英語で検索 そこで、検索ワー
IEでCSS3の効果を出せる。 クロスブラウザ対応 CSSスニペット 2011-02-01 影をつけたり、角丸にしたり、便利なCSS3。モダンブラウザは続々と実装されています。 しかし依然としてIEのシェア率が多い現在では、「CSS3を使うのは、ちょっと・・・」と思っている方も多いと思います。 そこでIEのfilterを利用し、JavaScriptや画像を使わずに、CSS3に近い効果を表現できる、 実用的なCSSのスニペットを紹介致します。 Opacity 指定したボックス自体の不透明度を変えることができます。 また指定した要素の下位の要素に対しても、効果が継承されます。 imgのロールオーバーなどの使い道があります。 Opacity Sample .opacity { opacity: .5; /* FireFox, Webkit, Opera */ -ms-filter: "progi
Posted: 2012.02.03 / Category: javascript / Tag: jQuery jQueryを使って画面遷移のないサイトを作ろうとしたときのちょっとしたメモです。 サーバーとやり取りをする、Ajax的なことは書いていないのであしからず。 リンク(href)を無効にする 画面遷移のないWebサイトでもJSのない環境やSEOも考慮して href にリンク先を設定したいときがあります。 hmtl <a href="hoge.html" id="btn">ボタン</a> このような場合だと #btn にイベントを設定しても画面遷移してしまいます。 click イベントに「e.preventDefault()」と記述すればhrefを無効にになり画面遷移が行われません。 javascript $('#btn').click(function(e){ e.preventD
ブログを構築する際、記事一覧ページ等で各記事本文の表示文字数を制限する方法をご紹介します。 wordpressでの文字数制限の方法については色々な制限方法が紹介されていますが、当サイトでは以下の方法で行っています。 使用ソース 使用方法 使用ソース 以下のソースを文章を省略したいページ(当サイトではindex.php)の本文位置に記載します。 <?php echo mb_substr($post->post_content,0,250).'...'; ?> <a href="<?php the_permalink(); ?>" >more</a> これで導入は完了です。実はこの方法を知るまで結構文字数制限に苦労していたので、簡単すぎて拍子抜けするほどでした。 使用方法 何文字まで表示させるかは、上記ソース内で250となっている数値を変更すれば設定出来ます。 なんでも、この数値は英文での数え
CSS is a beautiful language but it can also be frustrating at times. Certain CSS solutions don't work on certain browsers (cough Internet Explorer cough) and much of your time can be spent debugging code. Thankfully there are lots of great CSS snippets available online that fix common problems and design issues. In this article we have listed 30 CSS snippets that we think you will find very useful
Webページレイアウト、ナビゲーションプラグイン、フォーム、スライダー&カルーセルプラグイン、チャート&グラフプラグイン、イメージエフェクトプラグイン、ビデオプラグインなど。チェックしておきたいです。海外カジノ オンラインサイトの制作はワードプレスのプラグインを利用して様々な機能を付け加えて完成させることができます。2012年のjQueryプラグインまとめでは、デザインの一新や個別のカスタムにも対応した国際的で魅力的なサイト作成に役立つ情報を紹介しています。
だんだんと対応するブラウザも増えてきて業界の中では利用され、案件も増えてきたHTML5。もうすでにいくつか仕事として利用している方もいれば、これからという方もいると思いますが、今日紹介するのはHTM5スニペットの共有サイト「HTML5 Snippets」です。 スニペットとは、よく利用する短いコードの断片に分かりやすい名前を付け、ソースに利用しやすくするためのもの。「HTML5 Snippets」では、基本的なフレームから、細かなパーツまで、様々なスニペットが共有されています。いくつか気になったスニペットをピックアップしてご紹介致します。 詳しくは以下 HTML5 snippet : Basic Structure HTML5 HTML5の基本テンプレート。jQueryやDD_belatedPNGなども最初から読み込まれいます。 HTML5 snippet : A css rounded
昨今の WordPress 人気にあやかって、「WordPress スニペット」とか「WordPress functions.php カスタマイズ」とかで検索すると、functions.php を使ってできる簡単なカスタマイズ方法が出てきます。 これらを functions.php で管理してるとテーマを変更した時とか、コピペしなおさなきゃ行けなくなって面倒くさいことこの上ありません。 このカスタマイズやっぱ要らないなーとか思っても、すでにどこに書いていたか分からなくなっちゃうなんてこともしばしば。 そんなわけで、私はこれらのスニペットについては簡単なプラグインを作って管理してます。 # 昔は my-hacks.php ってファイルを使って管理できたんですが、WordPress 2.8 以降から非推奨になっちゃいました。 プラグインのソースは、こんな感じです。 これを wp-content
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く