ツクロア - DESIGN LABメンバー募集中 デザインラボ・ツクロアを読んで、一緒に仕事をしたいと思ってくれた方、こちらもご覧ください。 採用情報 私たちについて このメディアを発信しているツクロアというチームのこだわりや仕事への取り組みをご紹介します！ ツクロアについて
slick - the last carousel you'll ever need
Features Fully responsive. Scales with its container. Separate settings per breakpoint Uses CSS3 when available. Fully functional when not. Swipe enabled. Or disabled, if you prefer. Desktop mouse dragging Infinite looping. Fully accessible with arrow key navigation Add, remove, filter & unfilter slides Autoplay, dots, arrows, callbacks, etc... Single Item
【Labs】CSSだけでドロップダウンメニュー
こんにちは（・∀・） CSSだけで作ってみましたシリーズです。今回はドロップダウンメニューをご紹介します。通常のドロップダウンメニューとtransitionプロパティで動きのあるドロップダウンメニューの横バージョンと縦バージョンの4タイプです。 transitionプロパティはdisplayでの制御をサポートしていないため、子孫メニューの制御はoverflowで行っております。displayでの制御も可能ですが、その場合動きはなくなり、表示している矢印も表示されなくなります。 1. 横並びドロップダウンメニュー 横並びで表示するドロップダウンメニューのサンプルです。 ① 通常のドロップダウンメニュー HTML <ul class="nav"> <li><a href="#">Home</a> </li> <li><a href="#">Strategy</a> <ul> <li><a hr
Semantic UI
Design Beautiful Websites Quickly Semantic is a development framework that helps create beautiful, responsive layouts using human-friendly HTML. Concise HTML Semantic UI treats words and classes as exchangeable concepts. Classes use syntax from natural languages like noun/modifier relationships, word order, and plurality to link concepts intuitively. Get the same benefits as BEM or SMACSS, but wit
Nifty Modal Window Effects
A set of experimental modal window appearance effects with CSS transitions and animations. Today we want to share some ideas for modal window effects with you. There are infinite possibilities for transitioning the appearance of a dialog box and we wanted to provide some ideas of how to show dialog boxes and provide some inspiration. The idea is to have a trigger button (or any element) which will
Basic jQuery Tabs
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qu
今さら聞けない! ビギナーのためのJavaScript講座(1) タブ切り替えで、JavaScriptの基本を学ぶ(1) クリックイベントを書いてみよう
デザイナーと名が付く職種にはさまざまなものがありますが、この数年で劇的に市場のニーズが高まったのが「Webデザイナー」でしょう。 ネットワークの通信速度が一昔前に比べて格段に速くなり、スマートフォンが驚く速さで普及したことで、ユーザーがWebに接する時間は大幅に伸びました。その結果、魅力的なWebページを"創る"人材への需要がとみに高まっています。 魅力的なWebページを作るうえで最も必要とされるのは、ユーザにとって使いやすく、情報が得やすいデザインを考えられるスキルです。現在のWebデザイナーの中には、DTPなどの世界で経験を積んだ後に、HTML/CSSという慣れないコーディング技術をどうにか学んで転身した方が多く、紙媒体で伝える手法と、ブラウザで伝える手法の違いを思い知らされた方は少なくないのではないはずです。 そのような方々に対して、次なる障壁として立ちはだかるのがJavaScrip
【連載】今さら聞けない! ビギナーのためのJavaScript講座
デザイナーと名が付く職種にはさまざまなものがありますが、この数年で劇的に市場のニーズが高まったのが「Webデザイナー」でしょう。そのWebデザイナーに対して大きな障壁として立ちはだかるのがJavaScript。HTML/CSSのようなマークアップ言語とは異なり、プログラミング言語であるJavaScriptに関しては、どうしても敬遠してしまう方も多いはずです。
The 10 Most Popular Open Source Front-End Web UI Kits — Speckyboy
Resources by Application Bootstrap Templates Figma Templates Flyer Templates Illustrator Templates InDesign Templates Lightroom Presets Logo Templates Logo Fonts Mockup Templates Photoshop Actions Photoshop Brushes Resume Templates Tailwind CSS UI Kits Web Templates Video & Motion Design Templates All Motion Design After Effects Apple Motion DaVinci Resolve Final Cut Pro Premiere Pro Presentation
Kwicks for jQuery
Kwicks for jQuery (v2.2.1)Welcome to the Kwicks for jQuery home page. Kwicks is a plugin providing sexy sliding panels with an emphasis on navigational interaction. Kwicks was originally a port of a MooTools effect (of the same name), but has since evolved into a highly configurable and versatile UI component. Please check out the examples to see it in action. New in v2.2.1This is a patch release
JavaScript でタブ切り替え UI を実装する | WWW WATCH
先日、タブ切り換えタイプの UI を、JavaScript と CSS で簡単に実装する仕組みを探していて （他力本願）、ちょうど求めていたスクリプトが Arc... 先日、タブ切り換えタイプの UI を、JavaScript と CSS で簡単に実装する仕組みを探していて （他力本願）、ちょうど求めていたスクリプトが Archiva さんで紹介されていたので使わせていただきました。 時間がなかったので、できれば自分では書きたくないなぁ、なんかいいの公開している人いないかな～なんて思っていたのですが、おかげ様で助かりました。ということで、お礼を兼ねて紹介させていただきます。 タブ切替をサクッと実装 ： Archiva タブ切り換えを実装する JavaScript ライブラリやサンプルソースはいくつか存在しますが、私が求めていたのは JavaScript が OFF の時でもページ内リンクと
単純なパララックス効果を少しのjQueryコードで作る - かちびと.net
この記事は年以上前に書かれたもので、内容が古かったり、セキュリティ上の問題等の理由でリンクが解除されている可能性があります。 シンプルなパララックス効果 を少しのjQueryコードで作る というTips。プラグイン化さ れていますのでレイヤーの追加 も簡単です。 個人的にはあまり見かけなくなった印象のパララックス効果のあるサイトですが、まだ需要はあるみたいです。 今日は単純なパララックス効果のあるコンテンツを少しのjQueryコードで作るTipsです。 Sample マウスに合わせてレイヤーが動きます。 (function($) { $.fn.paralax = function(container, speed) { var $window = container, t = speed || 1, $object = this; return $window.on("mousemove
jQuery / CSS3 TIPS｜BLACKFLAG
BLACKFLAGで紹介しているjQueryとCSS3を使って実装するスライドショーやカルーセル等、Webサイト上でのUI系スクリプトのTIPSをまとめたページになります。 ※一覧は随時更新します。 Comments (6) html/css/jquery などのtipsが多彩のサイト | webサイト作成に関する自分メモ | 2013.02.25 19:11 […] jQuery/CSS3 TIPS jQuery/CSS3 TIPS […] きのぴ | 2015.12.04 14:01 はじめまして、 パララックスデザインのソースについて探しておりました。 勉強も兼ねてですが、簡単なLPサイトで使用させていただこうと考えております。 こういったサイトがあるとすごく助かり、また勉強にもなります。 ブックマークさせていただき、ちょくちょく拝見させていただければと思います。 ありがとうございま
21 Beautiful Examples of Single Page Websites
24 Comments Nice article! Thanks for this, best wishes Ron Nice collection! Fine list, thanks. My single page: https://wpletter.de Some lovely polished websites, thanks. Is not easy create a good work in a single page,…but this list say who all is possible. Good inspirations..Thanks for sharing. http://www.candecreative.com is a brilliant one-pager too.. love the parallax I’d love to figure out a
jQuery for Designers - Tutorials and screencasts
Welcome to jQuery for Designers Learn how easy it is to apply web interaction using jQuery Search Search for Featured Simple use of Event Delegation Posted on 14th June 2011 — Event delegation may be some techie term that you’d rather shy away from, but if you’ve not already used it, this example will show you a simple but powerful use of event delegation. View Tutorial 16 Comments Tutorials – It’
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
jQuery Content Slider | Responsive jQuery Slider | bxSlider
これからのWeb制作に使える、面白いUIを実装できるjQuery・CSS集
ASCII.jp：Web制作の現場で使えるjQuery UIデザイン入門
Bootstrap向けの汎用的なモーダルボックス実装スクリプト・Bootstrap Modal - かちびと.net
HTML5 User Experience Design - ＠IT