モバイルWebのUIを速くする基本テクニックがわかる──Google I/O 2016 High Performance Web UI
モバイルWebのUIを速くする基本テクニックがわかる──Google I/O 2016 High Performance Web UI 川田寛（ピクシブ株式会社） こんにちは、ふろしきです！ 私はHTML5 Experts.jpで、過去2年ほどGoogle I/Oの情報を発信し、Web技術の変化についてお伝えしてきました。振り返るとGoogleは、2014年にモバイルWebの提唱と技術要素の拡大を図り、2015年からは「RAIL（モバイルWebが目指すべきパフォーマンス指標）」や「Progressive Web Apps（アプリのように振る舞うWeb）」といった、モバイルとの親和性が高いWebを作り出すための”考え方”を推し進めました。今年2016年は、さらにそれを踏み込んでいったという感じがします。 今回のI/Oで取り上げるのもそのひとつ。毎度お馴染みGoogle Developer A
phiary
デフォルトの input[type=file] ってなんか古臭い感じがしますよね？ とはいえ CSS でスタイリングしようとすると, デフォルトでかかってるスタイルが複雑でちょっとハードルが高かったりします. そこで今回は『Dropify』という jQuery プラグインを使って input[type=file] をかっこ良くする方法について紹介します. 『Dropify』を知ったきっかけ 『phpspot開発日誌』さんのこちらのエントリーで カッコ悪いinput[type=file]をモダンにしてドラッグ＆ドロップ対応にする「Dropify」:phpspot開発日誌 紹介されていて, 便利そうだったので使ってみました. 『Dropify』とは？ オフィシャルに Override your input files with style とあるように input[type=file] をかっ
【CSS】Googleが公開したUI/UXライブラリ「Material Design Lite」を試してみた | unitopi - ユニトピ -
Androidをはじめ、Googleサービスで導入されているMaterial Design（マテリアルデザイン）のUI/UXを簡単に使うことができるライブラリが公開されました。 配布元はGoogleで、Material Design Liteと呼ばれるライブラリです。 CSS font Javascript のライブラリです。 早速使い方と使用例を見て行きたいと思います。 ダウンロード Material Design Lite 上記URLからどうぞ。 DLが済んだら配置し、以下のように指定してあげます。 <link rel="stylesheet" href="./material.min.css"> <script src="./material.min.js"></script> <link rel="stylesheet" href="//fonts.googleapis.com/i
MUI: The React component library you always wanted
Ready-to-use foundational React components, free forever.
Documentation - Materialize
flash_on Speeds up development We did most of the heavy lifting for you to provide a default stylings that incorporate our custom components. Additionally, we refined animations and transitions to provide a smoother experience for developers. group User Experience Focused By utilizing elements and principles of Material Design, we were able to create a framework that incorporates components and an
角丸に角丸を入れ子にした時、それぞれの角丸をバランスよくデザインする方法
角丸のパネルに角丸のパネルを重ねたデザインで、それぞれの角丸はどのくらいにしていますか？ 親と子のカーブを同じにしたり、親のカーブを緩やかにしたり、その時の見た目でデザインすることもあるかもしれません。 こういった時の一つの目安として、バランスが良い角丸のデザイン方法を紹介します。 しっかりとした数値で2つの角丸をデザインすることができます。 Quick Tip: Rounded Corners Done Right 見た目的になんとなくデザインではなく、親と子の角丸の中心点を揃えてカーブを描きます。こうすることで、2つの角丸は非常にバランスのとれたものになります。
jQuery：チェックされたら or 入力されたら送信可能にするボタンを実装する方法 - NxWorld
割と頻繁に使うので備忘録。 jQueryを使用して「チェックボックスにチェックされたら送信可能にするボタン」と「文字が入力されたら送信可能にするボタン」をそれぞれ実装する方法です。 特にチェックボックスの方は利用規約などに同意してもらったかの部分で用いたりと使う場面が多いのではないかと思います。 チェックボックスにチェックされたら送信可能にするボタン ページが表示された際はイメージ左のようにボタンにはdisabledが指定されて送信できない状態になっています。 それを「利用規約に同意します」というテキスト横にあるチェックボックスにチェックが入ったら、ボタンに指定してあるdisabledを解除して送信可能にするというものです。 実装にはjQueryを使用するので予め読み込ませおき、それぞれ下記のように記述をします。 <input type="checkbox" id="check" /><l
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
デザインの勉強にもなる、CSSで実装するパンくずのまとめ
JavaTechnology Slot Online | Cara Daftar bermain Slot Online
「Onsen CSS Components」をリリースいたしました!