An all-in-one wizard plugin that is extremely flexible, compact and feature-rich. Download

Foggy Foggy is a jQuery plugin for blurring page elements. It supports IE (8 and up), Firefox, Safari and Chrome. Here, both paragraph text and image in the background have been blurred with Foggy. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis commodo massa viverra diam pharetra quis dictum mauris bibendum. In eget tortor id risus suscipit facilisis. Duis luctus tortor non sem moll
<!DOCTYPE html> <html lang="ja"> <head> <meta charset="utf-8"> <style type="text/css"> body { background-color: #999999; } .sampleContents { width: 100%; height: 600px; background-color: #fff; } </style> </head> <body> <div class="sampleContents adaptive-target"> <img src="https://qiita-image-store.s3.amazonaws.com/0/83231/c60f3d3c-4e6c-fc3c-8b99-a9724408fff3.png" class="sampleImage" data-adaptive
Here's The Deal CLNDR is a jQuery plugin for creating calendars. Unlike most calendar plugins, this one doesn't generate markup. Instead you provide an Underscore.js HTML template and in return CLNDR gives you a wealth of data to use within it. CLNDR is free of opinions about markup and style: it is the high-speed chassis on which you build the vehicle of your dreams. For a little backstory and a
JavaScriptで配列をシャッフルしてその要素をランダムに表示させるにはどうしたらいいのか調べてみた。 するとJavaScriptでは割と有名なシャッフルするアルゴリズムがあるようなので調べたところ「配列を拡張してみた。Array.shuffle() Array.clone() – JavaScript」というサイトで見つかりました。 アルゴリズムの難しい話は置いておいて、今回はこのアルゴリズムを利用して、配列をシャッフルした後にjQueryも使ってランダムに表示させていたいと思います。 Array自体をprototypeで拡張する まぁそのまんまjavascriptのarray要素自体をprototypeで拡張させます。Fisher–Yatesアルゴリズムらしいです。 拡張したshuffleメソッドは普通のpush()のように使えます。 //シャッフルのアルゴリズム prototyp
We're under construction. Please check back for an update soon.
Upload in HTML5 We are using HTML5 APIs. Always. Plupload is based on multi-runtime pollyfills for XMLHttpRequest L2, File and Image APIs. So when there's no HTML5 available in the browser, we emulate it ourselves. mOxie (combined code-name for pollyfills) is completely standalone and available separately. Drag'n'Drop Files from Desktop Files not only can be picked from browse dialog, but also can
仕事の傍ら、暇つぶしとかでwebアプリを構築したりするわけですが、どうにもUIセンスがなさすぎて、カッコイイサイトとかを参考に真似したりしても、なぜか自分でアレンジするととてつもなくダサくなる、ということを繰り返してきました。 で、もうこうなったら自分で考えずに、すべてライブラリに頼ろう!と思ってwebサイトを構築した時に使ったcssやjsのフレームワーク、ライブラリなんかを、簡単なコメント添えてまとめておこうと思います。 css自分で一切書かなくても、このぐらいのUIまではいけそうです。 フレームワーク Bootstrap ベースはtwitter bootstrapの恩恵に授かります。 GoogleMaterialDesignLiteも見た目はかっこいいんですが、色々コンポーネントがたりなかったりして、結局いくらか自分でデザインしないとどうにもならなくなる印象です。 jQuery 今更書
jQuery File Upload Demo File Upload widget with multiple file selection, drag&drop support, progress bars, validation and preview images, audio and video for jQuery. Supports cross-domain, chunked and resumable file uploads and client-side image resizing. Works with any server-side platform (PHP, Python, Ruby on Rails, Java, Node.js, Go etc.) that supports standard HTML form file uploads. Pintura
Autocomplete Enables users to quickly find and select from a pre-populated list of values as they type, leveraging searching and filtering. The Autocomplete widgets provides suggestions while you type into the field. Here the suggestions are tags for programming languages, give "ja" (for Java or JavaScript) a try. The datasource is a simple JavaScript array, provided to the widget using the source
とりあえずRequireJS0.14.5+jQuery1.4.3,RequireJS0.15.0+jQuery1.4.4で発生。 IEは6~8っぽい。 なんで気づいたかというと IEでjQueryUI等の動作がおかしくなった CSS Box Modelがサポートされている状態なのに$.boxModel(=$.support.boxModel)がtrueでない falseですらなくundefinedだった $.boxModelの検出はjQuery(function(){})内で行われていた。 $(document).ready()と同じ 検証 対象:RequireJS0.15.0+jQuery1.4.4 環境:IE7(+CompanionJS) 今、仕事で作ってるアプリで使っているallplugins-require.jsとjquery-1.4.4.jsに 以下のようにconsole.log
No dependencies, fast and small 10KB JavaScript and 2.5KB CSS, that's all (minified, gzipped). User-friendly Navigate using keyboard or mouse. Easily change the themes for your website. Browser compatibility Works on Google Chrome, Mozilla Firefox, Opera, Safari and even Internet Explorer. Why using Intro.js? When new users visit your website or product you should demonstrate your product features
Download Now! Download now to get started. The package includes all the JavaScript and CSS you'll need to add ScrollTabs to your user interface. Download (.zip) Download (.tar.gz) Automatically adjusts to detect whether scrolling is needed, ideal for responsive interfaces. One of the greatest features for jQuery ScrollTabs is that you can have different right-and-left side styling depending on if
こんにちは、制作部デザイナーのぺちこです。 近頃動画を使ったサイト制作に関わらせていただく機会に恵まれておりますが、 お恥ずかしながらvideo実装をしたことがなかったので、 ひたすら勉強三昧でした。 背景に動画を使ったサイトも、今ではだいぶん主流になってきた印象ですが、 動画を1つのコンテンツとして、長めにしっかりと載せているサイトも増えてきましたね! 動画を大事なコンテンツの一部とすると、 YouTubeやVimeoで簡易的に載せるだけではどうしても物足りず…。 せっかくなので<video>タグを使用してオリジナルのコントローラーやシークバーを作ってしまおう!というのが今回の記事の内容です。 では早速行きましょう! オリジナルUIの全画面動画を<video>で実装する方法 JSを使用すればvideoをがっつりコントロールできるのですが、 これがまた調べてもスクリプトが出てくるばかりで、
こんにちは。デザイナーのはるえです。 もうほとんどの案件でPC+スマホ制作がセットになってきましたね。 LIGに入社したての1年前まではスマホの制作経験を聞かれてうつむき気味だった私も、おかげさまで今じゃスマホサイトを喜んで作るようになりました。 ありがとうございます!! そこで今回は、スマホサイトで使われやすいドロワーメニューやスワイプ実装の際に必要となるプラグインをご紹介させていただきます。 【こちらもおすすめ】 ☞ 高機能なJavaScriptの人気スライダープラグイン4つを実際に使ってレビューしてみた Facebookでもおなじみのドロワーメニュー3選 今じゃ基本中の基本となっているドロワーメニュー。 Facebookなどで使われている、横からぬるっと出てぬるっと引っ込むあれです。動きが気持ちよくて、実装も簡単にできるものを中心にまとめてみました。 jQuery slimMenu
Why SVG (and Snap)? SVG is an excellent way to create interactive, resolution-independent vector graphics that will look great on any size screen. And the Snap.svg JavaScript library makes working with your SVG assets as easy as jQuery makes working with the DOM. Modern features for modern browsers Snap.svg is designed for modern browsers and therefore supports the newest SVG features like masking
Mon, Jan 1, 0001 Lazy Load delays loading of images in long web pages. Images outside of viewport will not be loaded before user scrolls to them. This is opposite of image preloading. This is a modern vanilla JavaScript version of the original Lazy Load plugin. It uses Intersection Observer API to observe when the image enters the browsers viewport. Original code was inspired by YUI ImageLoader ut
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く