OS X Yosemite Style UI
Playing with CSS transparency and blur filter to simulate "frosted film" translucency effect featured in OS X Yosemite... Current browser support is limited, however: http://caniuse.com/#feat=css-filters Update 2018.04.16: Blurred :before element's size extended beyond visible bounds to eliminate blur falloff of the filter. Added $blur variable for easier manipulation. Update 2018.05.30: Replaced
[JS]これ、いい！サイトのデザインを損なわずにフォームの進捗を美しく表示するスクリプト -Fort.js
デモページ：Sections デモでは他にもグラデーションを使ったGradient、進む時に光るFlashなどが用意されています。 デモページ：Default デモページ：Gradient デモページ：Sections デモページ：Flash Fort.jsの使い方 Step 1: 外部ファイル 当スクリプトとスタイルシートを外部ファイルとして記述します。 <head> ... <script src="fort.min.js"></script> <link rel="stylesheet" href="fort.min.css"> </head> Step 2: HTML バーを表示するdivをセットします。 <body> <div class="top"> <div class="colors"></div> </div> Step 3: JavaScript 適用するエフェクトを指
スクロールやクリックした際に、おおっ！と思わせるクリエイティブな7つのエフェクトがかっこいいっ！
ユーザーがページを表示し、スクロールやボタンをクリックした際に、おおっ！と思わせるクリエイティブなエフェクトを7つ紹介します。 Inspiration for article intro effects 7つのエフェクトをアニメーションgifにしてみました。 ページはフルスクリーンサイズの画像が最初に表示され、そこをスクロールボタンクリックでさまざまなエフェクトがおきます。派手すぎず、センスあるかっこいいエフェクトばかりです！ 各エフェクトのソースは上記ページからまとめてダウンロードできます。
[CSS]ボタンにぷるるんとかわいいアニメーションを与えるスタイルシート -Galatin effect
a要素にテキストを配置して実装したシンプルなボタンに、ゼリーのようにぷるるんとさせるアニメーションを与えるスタイルシートを紹介します。 ↓は、デモをアニメーションgifにしてみました。 Gelatin over button effect with Sass HTML HTMLは非常にシンプルです。 <a href="#" class="btn">Click Here</a> <a href="#" class="btn btn-secondary">Click Here</a> CSS スタイルシートは少々長いですが、こぴぺでそのまま利用できます。 Sass版は、Gelatin effectをご覧ください。 a.btn { display: inline-block; margin: 15px 15px 0; padding: .6em 1.1em; font-size: 26px; f
Inspiration for Article Intro Effects | Demo 5
Some are born to the endless night Inspiration for Article Intro Effects by Henry James — Posted in Inspiration on May 21, 2014 We may define a food to be any substance which will repair the functional waste of the body, increase its growth, or maintain the heat, muscular, and nervous energy. In its most comprehensive sense, the oxygen of the air is a food; as although it is admitted by the lungs,
808 Cube
Concept Aleatoric music is music which is composed using an element of randomness. This style of music dates back to at least the 15h century and comes from the latin word for dice, which were used in 18th Century musical dice games. The American composer John Cage created aleatoric music composed from ancient Chinese methods of randomness known as the I Ching. Here we are taking a modern classic
HTML5 × CSS3 × jQuery – #20 文字をランダムでカシャカシャ動かしながらテキストを表示させるプラグインを作る | DevelopersIO
リリィ・シュシュのすべて という映画をご存知でしょうか？2001年に公開された岩井俊二監督の作品で、当時は結構好きで何度も観返したものでした。 劇中にて文字がカシャカシャとランダムに動きながら文章が表示されていくエフェクトがあるのですが、これを JavaScript で作ってみました。Flash 全盛のころから Web コンテンツにはよく取り入れられてるエフェクトではありますが、使い所さえ間違えなければ今でも充分に通用するカッコよさを持っています。 今回は jQuery を使わずに素のJavaScript (Vanilla JavaScript) だけでプラグインを作りました。このシリーズの趣旨から大きく外れてますが、そこは仕方ないね。 LetterTicker - 文字をランダムでカシャカシャ動かしながらテキストを表示させる Step.1 | とりあえず動くものを作ってみる まずは動くも
Grid Loading and Hover Effect | Demo 3
Illustrations by Ryo Takemasa Kenpo News April 2014 issue SQUET April 2014 issue MONOCLE issue 72 TOWN Winter 2013 Quarterly Musashino autumn of 2013 issue MONOCLE issue 69 Real Simple May 2014 The 65th Book Week Real Simple May 2014 Quarterly Musashino spring of 2014 issue MAJESTY express vol. 01 Shitamachi Rocket Quarterly Musashino winter of 2013 issue MAINICHI CHUUGOKUGO April 2014 Kenpo News
Sites-KENZO_WW-Site
Skip to main content Skip to footer content Choose your country / region AMERICAS Canada Mexico United states EUROPE Austria Belgium Bulgaria Croatia Cyprus Czech republic Denmark Estonia Finland France Germany Greece Hungary Iceland Ireland Italy Latvia Lithuania Luxembourg Malta Netherlands Norway Poland Portugal Romania Slovakia Slovenia Spain Sweden Switzerland United kingdom ASIA Hong kong sa
the way down / FACT : Smartphone Music Video
FACT new album ‘KTHEAT’: Special Contents. Interactive Smartphone Music Video ‘The Way Down'. / FACTニューアルバムKTHEATスペシャルコンテンツ。インタラクティブ・スマートフォン・ミュージック・ビデオ the way down。
Morphing Buttons Concept | Codrops
Some inspiration for a morphing button concept where the action element (button) morphs into a component. The examples show different types of components, i.e. fullscreen overlay, modal window, sidebar and more. Today we want to share a bit of inspiration for a morphing button concept. You have surely come across this concept already: the idea is to use an element of action, like a button, and mor
ノイズエフェクトの作り方 | Fuzz blog
HTML, CSS, JavaScriptを使い、当ブログのサイトロゴのようなノイズエフェクトの実装方法を紹介します。 CSS3のアニメーション周りを使えばJavaScript無しでも実装できそうですが、ランダムな動きをつけたり細かい制御をかけたい場合などもあるのでJavaScriptでアニメーションさせてみます。 デモページ ソースの紹介の前に、簡単にまずは原理を。 ノイズさせたい画像の高さ分のHTMLの要素を用意。 （高さ120pxの画像なら120個） 各要素の高さを1pxに指定し、背景画像にノイズさせたい画像を指定。 背景画像位置は各要素1pxずつずらす。 これで見た目は画像そのまま、実態は高さ1pxの要素の集合体となります。 そして、これらの要素にposition: relativeを指定し、アニメーションループ中にleftの値をランダムに動かす。 これでノイズ
Delaunay triangle pattern maker
Press space to drop or pick up the light. Enter key to add another one by msurguy Blog post Source
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Arrow Navigation Styles
WordPress › Error
COLLECTION | Focus: Life Gear by Trident
Physical Typography - Resonate 2014
CodePen - CSS and SVG Masks
Edit fiddle - JSFiddle - Code Playground
Happy 25th birthday Game Boy
