タグ 超軽量
人気順 5 users 10 users 50 users 500 users 1000 users『ゼルダの伝説 ティアーズ オブ ザ キングダム』にて“超軽量”な乗り物新素材が発見される。謎の挙動が生み出す絶大な推進力 - AUTOMATON
2023/07/06
128 users
アクションアドベンチャーゲーム
AUTOMATON
ゼルダ
『ゼルダの伝説 ティアーズ オブ ザ キングダム』にて、超軽量かつ空気抵抗の大きい“新素材”が発見された。不思議な特性により、飛行機などのパーツに用いることで大きな推進力を得られるという。 『ゼルダの伝説 ティアーズ オブ ザ キングダム』は、Nintendo Switch向けに発売中のアクションアドベンチャーゲームだ。... 続きを読む
シンプルなHTMLで、モダンなWebサイトをすばやく簡単に作成できるクラスレスの超軽量CSSフレームワーク -Simple.css
2022/02/07
352 users
グラスレス
CSSフレームワーク
ポートフォリオ
HTML
その名の通り、シンプルなHTMLで、Webサイトをすばやく簡単に作成できるクラスレスの超軽量（4kB）CSSフレームワークを紹介します。 シンプルなWebページ、ポートフォリオやブログなどをすばやく作成したい時に便利で、レスポンシブにもダークモードにも対応しています。また、CSSリセットとして利用するのもありかもし... 続きを読む
これを使うとスクロールに連動したアニメーションが簡単に！わずか2KBの超軽量JavaScriptライブラリ -Sal.js | コリス
2018/09/12
210 users
コリス
スクロール
スクロールアニメーション
アニメーション
スクロールに連動して、ページ上の要素をアニメーションで表示するライブラリはいくつかあります。その中でもかなりの超軽量で、他スクリプトへの依存が一切ないスクロールアニメーションのライブラリを紹介します。 しかも実装は超簡単。手間がかかりそうと思っていた人は、ぜひお試しを。 Sal.js Sal.js -GitHub Sal.j... 続きを読む
[JS]ありそうでなかった！スクロールエフェクトのベースになるさまざまな値を取得するシンプルな超軽量スクリプト -roll.js | コリス
2015/11/19
163 users
エフェクト
スクロール
スクリプト
しん
ポジション
縦長ページのスクロールを利用したエフェクトに必要なさまざまな値、スクロール量、ポジション、ページネーションなどを正確に取得することに特化された超軽量（3kb gzip）のスクリプトを紹介します。 作者様曰く、これ系のシン...記事の続きを読む 続きを読む
[JS]シンプルで超軽量なのがいい！レスポンシブ対応のカード型レイアウトを簡単に実装できるスクリプト -minigrid | コリス
2015/08/03
338 users
jQuery
コリス
Body
Step
スクリプト
レスポンシブ対応のカード型レイアウトを簡単に実装できる、jQueryなどの他スクリプトに依存しないシンプルで超軽量（2KB）のスクリプトを紹介します。 デモのアニメーション minigridの使い方 Step 1: 外部ファイル 当スクリプトを外部ファイルとして記述します。 <body> ... コンテンツ ... <script src="http://henriquea.github.io/m... 続きを読む
JavaScriptとCSSは不要！SVGの気持ちいいアニメーションで作られた超軽量のかわいいローディング -SVG Loaders | コリス
2014/12/10
129 users
ローディング
コリス
SVG
Step
SVGファイル
JavaScriptもCSSも画像も使用せず、SVGで実装された軽快で気持ちいいアニメーションで動くローディングのアイコンを紹介します。 ページに実装する時もJavaScript/CSSは必要ありません。簡単なHTMLでOK！ デモページ SVG Loadersの使い方 使い方は、簡単！ Step 1: SVGファイルをダウンロード 下記ページの右サイドの「Downlaod ZIP」から、SVGフ... 続きを読む
[JS]動画をブラウザいっぱいや指定サイズに背景として配置できる超軽量スクリプト -CoverVid | コリス
2014/11/10
110 users
WebM
コリス
jquery.js
Body
Step
.mp4, .webm などの動画をブラウザいっぱいやセクションの背景として配置できるjQueryの超軽量（800bytes）プラグインを紹介します。 デモページ 単に要素内の背景として表示しているため、デモのようにスクロールエフェクトと組み合わせることも簡単です。 CoverVidの使い方 Step 1: 外部ファイル 当スクリプトとjquery.jsを外部ファイルとして記述します。 <body... 続きを読む
[JS]デモがめちゃ楽しい！jQuery不要でスクロールにあわせて要素をアニメーションで表示するスクリプト -WOW.js | コリス
2014/02/11
181 users
コリス
ビューポート
jQuery不要
スクロール
スクリプト
ページを表示した時やスクロールした時など、ページ上の要素がビューポートに表示された時に各要素にさまざまなアニメーションをセットする超軽量（3KB）スクリプトを紹介します。 上から左から右からスライドさせたり、タイミングをずらして順番に表示したり、さまざまな設定を簡単に実装できます。 WOW.js WOW.js -GitHub WOW.jsのデモ WOW.jsの使い方 WOW.jsのデモ デモでは上... 続きを読む
[JS]スクロールしてもサイドバーなどの要素を貼り付けたように常に表示させるシンプル高性能超軽量スクリプト -Sticky-kit | コリス
2013/08/07
127 users
jQuery
STE
コリス
一行
実装
ユーザーがスクロールした際、指定した要素をぴたっと貼り付けたように指定範囲に常に表示させるスティッキー用のjQueryのプラグインを紹介します。 実装は非常に工夫されており、シンプルかつ高性能、しかも1.8kの超軽量！ 一行の記述で、複数の要素を異なる範囲に表示させることもできます。 複数の要素を異なる範囲にも貼り付けたデモ Sticky-kitの使い方 実装は非常にシンプルで、簡単です。 Ste... 続きを読む
素早く簡単にGoogleマップを導入できるjQueryプラグイン「initmap.js」:phpspot開発日誌
2013/07/10
128 users
jQueryプラグイン
phpspot開発日誌
素早く簡単にGoogleマップを導入できるjQueryプラグイン「initmap.js」 2013年07月10日- jQuery plugin for Google Maps - initmap.js 素早く簡単にGoogleマップを導入できるjQueryプラグイン「initmap.js」 HTML5 Geolocation, Markers API等扱えて、スクリプト自体は1.7KBと超軽量。 ... 続きを読む
[JS]機能も充実、設置も簡単、デザインも素敵！モーダルウインドウを実装する超軽量のスクリプト -Pop Easy | コリス
2013/06/06
166 users
コリス
jQuery
モーダルウインドウ
easy
キャプチャ
Pop Easyはテキストや画像、フォーム、動画、Google Mapsなどを配置できるモーダルウインドウを実装するjQueryのプラグインで、モーダルウインドウ自体の機能・デザイン性も優れていますが、ページのデザインもかっこいいのはなかなか出会うことが少ないです。 下記のキャプチャだけでも、そのデザインにワクワクする人が多いと思います。 Pop Easy Pop Easyのデモ Pop Easy... 続きを読む
[JS]jQueryも外部CSSも不要！レスポンシブ対応サイトを作成する超軽量のスクリプト -skel.js | コリス
2013/05/22
491 users
jQuery
コリス
スタンドアローン
RESET
グリッド
スタンドアローンで動作する19KBの超軽量スクリプト。 さまざまなレイアウトに対応できるグリッド。 表示サイズごとのブレイクポイントの設定も簡単。 resetやbox-modelなどの有用なCSSのショートカットを用意。 プラグイン機能も備えているので、拡張にも対応。 skel.jsのデモ デモはシンプルな構成のページが表示が用意されています。 まずはデスクトップサイズとして、幅1200pxで表示... 続きを読む
[JS]自分仕様のかなりかっこいいローディング用アニメーションを生成できる -Sonic Creator | コリス
2013/04/02
270 users
SONIC
コリス
スクリプト
アニメーション
デモ
かっこいいデザインのローディング用アニメーションのCanvas版、アニメーションGIF版、CSSスプライトPNG版を同時に作成できるオンラインサービスを紹介します。 Sonic Creatorの前に、まずはSonicのデモから。 Sonic Sonicは、HTML5 Canvasを使ってローディング用のアニメーションを作成する超軽量（約3K）のスクリプトで、実装方法などは下記をご覧ください。 かな... 続きを読む
[JS]シンプルなHTMLでレスポンシブ対応のスライダーを実装する超軽量のスクリプト -Unslider | コリス
2013/03/18
206 users
jQuery
Unslider
コリス
スライダー
スクリプト
シンプルなHTMLでレスポンシブ対応のスライダーを実装する超軽量のjQueryのプラグインを紹介します。 デスクトップのキーボード操作やスマフォ・タブレットのスワイプ操作にも対応！ Unslider Unslider -GitHub Unsliderの特徴 Unsliderのデモ Unsliderの使い方 Unsliderの特徴 実装は簡単でクリーン HTMLは非常にシンプルで、カスタマイズも容易... 続きを読む
[JS]ページのデザインに影響を与えないパーフェクトなスクロールバーの超軽量スクリプト -Perfect Scrollbar | コリス
2013/01/29
306 users
スクロールバー
jQuery
GitHub
コリス
プラグイン
大きいコンテンツをクリップして配置する際に添えるスクロールバーを実装する3KBと超軽量のjQueryのプラグインを紹介します。 Perfect Scrollbar Perfect Scrollbar -GitHub 何をもってパーフェクトなのか Perfect Scrollbarのデモ Perfect Scrollbarの使い方 何をもってパーフェクトなのか このスクロールバーにパーフェクトとつけ... 続きを読む
[JS]超軽量で設置も簡単！Facebook, Twitter, Google+のボタンを設置するスクリプト -SocialCount | コリス
2012/11/28
376 users
Twitter
Facebook
SocialCount
デモページ：カウント付きで縦並び SocialCountの使い方 使い方のステップは、2つ。 これ以上ないくらいに簡単です。 Step 1: 外部ファイル スタイルシートとスクリプトを外部ファイルとして設置します。 まずは、スタイルシートをhead内に。 <head> <link rel="stylesheet" href="../src/socialcount.css"> </head> アイコ... 続きを読む
「Nexus 7」にマウスやキーボードをつないで超軽量のノートPCっぽく使う方法 - GIGAZINE
2012/10/16
379 users
Bluetooth
椅子
GIGAZINE
ウェブサイト
製品
7インチサイズの「Nexus 7」は持ち歩きには便利ですが、実際にしばらく使用してみたところメールやSNSの投稿などで少し長い文章を書く際にはキーボードが欲しいし、椅子に座ってじっくりとウェブサイトを見る時はマウスがあると便利、などと少し不満が出てきたので別売りの製品と組み合わせてノートPCっぽく使う方法をいろいろと試してみることにしました。 ◆マウスとキーボードをつなぐ 今回はBluetooth... 続きを読む
[JS]後発だけに高性能で、実装はシンプルで超軽量のツールチップのスクリプト -jQuery PowerTip | コリス
2012/08/15
315 users
コリス
スタティック
後発
追従
スクリプト
jQuery PowerTip jQuery PowerTip -GitHub jQuery PowerTipの特徴 jQuery PowerTipのデモ jQuery PowerTipの使い方 jQuery PowerTipの特徴 実装が簡単。 シンプルな構造。 ツールチップはカーソルに追従とスタティックに表示の2種類をサポート。 ツールチップの追従するエリアは設定可能。 カスタマイズも簡単。 ... 続きを読む
[JS]スライダーやタブやページネーションなど便利な機能を少ないコードで実装する超軽量（8kb）のスクリプト -vanity | コリス
2012/07/05
217 users
vanity
jQuery
コリス
スライダー
ウェブページ
スライダー、タブ、ページネーション、ツールチップなど、ウェブページでよく使用するコンテンツをシンプルにより少ないコードで実装できるよう開発されたjQueryのプラグインを紹介します。 vanity jquery toolset vanityは7種類のツールがあり、それぞれ8kbと超軽量のスクリプトとなっています。 機能はシンプルで、より少ないコードで簡単に実装できるように設計されています。 以下、... 続きを読む
[JS]シンプルで軽量だけど、充分な機能を備えたコンテンツスライダーのスクリプト -Casual Slider | コリス
2012/03/22
114 users
コリス
メジャーブラウザ
スライダー
スクリプト
実装
Casual Sliderの特徴 Casual Sliderのデモ Casual Sliderの使い方 Casual Sliderの特徴 Casual Sliderは実装が簡単で、シンプルながら充分な機能を備えたコンテンツスライダーです。 4KBと超軽量のスライダー タイマー機能付き あらゆるHTMLエレメントを配置可能 全てのメジャーブラウザをサポート カスタム ナビゲーション セットアップが簡... 続きを読む
[JS]アニメーションで動作する画像ギャラリーの超軽量すぎるスクリプト -Rhinofader | コリス
2011/10/31
125 users
jQuery
slideshow
コリス
images
手動
実用的なオプションを備えた、フェードのアニメーションで切り替わる画像ギャラリーを実装するjQueryのプラグインを紹介します。 操作方法は自動・手動の2つです。 左下のアイコンで再生・停止、左右の矢印アイコンで画像を前後に切り替えます。 Rhinofaderの実装 HTML 画像はリスト要素で実装します。 <ul id="slideshow"> <li><img src="images/001.j... 続きを読む
[JS]かなりかっこいいデザインのローディング用アニメーションを生成するスクリプト -Sonic | コリス
2011/08/28
482 users
コリス
矩形
script
SONIC
circle
HTML5 Canvasを使って、ローディング用のアニメーションを作成する超軽量（約3K）のスクリプトを紹介します。 デモページ Sonicの実装 Square（矩形）とCircle（円形）を例に実装方法を紹介します。 外部ファイル 当スクリプトを外部ファイルとして指定します。 <script src="sonic.js"></script> JavaScript: Square（矩形） あとは、... 続きを読む
[JS]超軽量、設置も簡単、オプションも豊富なスライドショーのスクリプト -Orbit | コリス
2011/08/10
272 users
Orbit
jQuery
コリス
jquery.js
text
実装も簡単で、オプションも豊富に揃った、使い勝手のよい画像スライドショー用のjQueryのプラグインを紹介します。 約4KBと超軽量なのもいいですね。 右上のオートプレイは状況も表示します。 Orbitの実装 外部ファイル 「jquery.js」と当スクリプトを外部ファイルとして指定します。 <script src="js/jquery.min.js" type="text/javascript"... 続きを読む
わずか4KBと軽量でカスタマイズしやすい、シンプルなデートピッカー（カレンダー）を実装するjQueryプラグイン・glDatePicker - かちびと.net
2011/08/08
260 users
デートピッカー
軽量
jQueryUI
net
カレンダー
軽量でカスタマイズしやすいデータピッカー のjQueryプラグイン・glDatePickerのご紹介。 とてもシンプルで、4KBと超軽量です。汎用 的で使いやすいかなと思ってエントリー。 jQueryUIでもいいっちゃいいんですけど、 データピッカーだけならUIを入れる必要は 無いですしね・・・ 何かとシンプルな方が使いやすく汎用性も高かったりしますね。4KBは確かに軽いです。また、IE6や7など... 続きを読む
[JS]IE6でもブラウザのサイズに合わせて最適なスタイルシートを適用するスクリプト -Adapt.js | コリス
2011/04/17
104 users
コリス
jQuery
スクリプト
Media Queries
CSS3のMedia Queriesを使用して同様のことができますが、CSS3非対応ブラウザでも動作し、且つjQueryなど他のスクリプトに依存しないでブラウザの幅をチェックし、そのサイズに最適化されたスタイルシートのみをロードさせる超軽量（894bytes）のスクリプトを紹介します。 スクリプトの制作は「960 Grid System」と同じNathan Smith氏なので、960 Grid S... 続きを読む