lightboxの超軽量版！jQuery不要の画像拡大スクリプト「Luminous」の基本的な使い方とオプションの説明、複数画像への適用方法 | WEMO
lightboxの超軽量版！jQuery不要の画像拡大スクリプト「Luminous」の基本的な使い方とオプションの説明、複数画像への適用方法 2019 8/15 クリックすると画像を拡大してくれる、いわゆる「lightbox（ライトボックス）」というスクリプトって便利ですよね。 制作現場でも多くの場面で導入されているかと思います。 ではみなさん、このライトボックス系のスクリプトプラグインの中でも、「Luminous」というjQuery不要の超軽量スクリプトプラグインをご存知でしょうか？ jQueryに依存しないファイル容量も、動作も軽い表示やアニメーションもシンプルでおしゃれ という素晴らしいライトボックス系プラグインです。 今回は、この「Luminous」の使い方をメモしていこうと思います。 まだ使い方を解説している記事も少なく、1枚にしか動かないような使い方しか紹介されてない記事が多か
Googleのサジェストをコピペで実装する - 気になるガジェット
jQuery UIのAutocompleteを使う HTML 説明 実行結果 初期状態 入力結果 動作確認 参考サイト jQuery Pocket Reference: Read Less, Learn Moreposted with amazlet at 17.01.16O'Reilly Media (2010-12-09) Amazon.co.jpで詳細を見る jQuery UIのAutocompleteを使う Googleのサジェスト入力って、どういう仕組なんだろうって調べてたら、jQuery UIのAutocompleteを使えば結構簡単に実装できることがわかりました。 ついでなので、Google検索のサジェスト自体を使うことができないか調べたら、基本的に「jQueryでAmazon_Googleのsuggest機能を実装する - タツノオトシゴの日記」で書かれている通り実装したら
JSといえばjQueryだったWebデザイナーが、Reactを1年間使って感じたメリット｜dwango creators' blog（ドワンゴクリエイターズブログ）
はじめまして、ほそだと申します。昨年秋まで個人事業主の立場でドワンゴでお仕事させていただいておりましたが、いろいろ経緯がありまして中の人になりました。ドワンゴ歴はそこそこ長い新入りです。よろしくお願いいたします。 さて、今回はデザイナー（HTML/CSS/JSは扱えるいわゆる「Webデザイナー」）として1年間ほどReactを使ってみたので、そのメリットを書いてみようかと思います。 Reactとの出会い ReactとはFacebook製のJSライブラリです。 https://facebook.github.io/react/ WebアプリケーションのView部分を実装します。2014年の暮れにエンジニアの方々が魂を震わせているのを見て存在を知りました。2015年はReact元年な感じでしたよね。 僕自身、以前から比較的JSを書くタイプのデザイナーではありましたが、正直なところ自分が関わってき
Sticky-Kit | jQuery plugin for sticky elements
Reference To install include jquery.sticky-kit.js after including jQuery. Usage: $("#sticky_item").stick_in_parent(); // or $("#sticky_item").stick_in_parent(options); You can pass a hash of options to configure how Sticky Kit works. The following options are accepted, each one is optional: parent — The element will be the parent of the sticky item. The dimensions of the parent control when the st
webdesign-dackel.com - このウェブサイトは販売用です！ - webdesign dackel リソースおよび情報
This webpage was generated by the domain owner using Sedo Domain Parking. Disclaimer: Sedo maintains no relationship with third party advertisers. Reference to any specific service or trade mark is not controlled by Sedo nor does it constitute or imply its association, endorsement or recommendation.
とあるサイトの高速化についてフロントエンドでやったことまとめ。 - Toro_Unit
業務で携わっている案件なのですが、アクセス数の急増が見込まれるイベントがありまして。準備期間も少なく、バックエンド側でできることがほぼないという状況でサイトを落とさないようにがんばる！というお仕事でした。レガシーソースてんこ盛り。CSSプリプロセッサとか何それ状態。 そこで実施した対策のまとめです。サーバー・アプリケーション・サイトの構成によって、効果の大小はありますが、比較的効果があったと思われるものをつらつらと。 リクエストの削減とファイルサイズの最適化 まず一番最初に考えなければいけないのがリクエスト数です。すごいおおざっぱに言うと、WEBサーバー（ApacheとかNginxとか）への負荷は、PV数×リクエスト数です。PVがそんなに無くてもそのページのリクエストがめちゃくちゃ多いとそれだけでかなりの負荷になります。リクエストを半分にできれば2倍の人数がさばけるってことに、すげーおおざ
jQueryプラグイン「Sticky-Kit」のコツ - Qiita
スクロールに追従するサブメニューを作る時に便利なjQueryプラグイン「Sticky-Kit」。 使い方とコツを自分用にメモしておきます。 ≫Sticky-Kit 基本的な使い方 <script src="lib/jquery.min.js"></script> <script src="lib/jquery.sticky-kit.min.js"></script> <div id="box" class="clearfix"> <div id="side"> ～サブメニュー～ </div> <div id="main"> ～主コンテンツ～ </div> </div> #box{ width: 700px; /* clearfixの記述は面倒なのでここでは省略 */ } #side{ float:left; width: 200px; } #main{ float:main; width:
ScaleOut | Supership
2024年4月1日より、Supership株式会社は親会社であるSupershipホールディングス株式会社に吸収合併されました。 合併に伴い、存続会社であるSupershipホールディングスは社名をSupershipに変更し、新たな経営体制を発足しました。本件に関する詳細は、プレスリリースをご確認ください。 2024年4月1日より、Supership株式会社は親会社であるSupershipホールディングス株式会社に吸収合併されました。 合併に伴い、存続会社であるSupershipホールディングスは社名をSupershipに変更し、新たな経営体制を発足しました。 本件に関する詳細は、プレスリリースをご確認ください。
jQueryとCSS3で作るページの上までスクロールするボタン
wordpressはプラグインがたくさんあって便利です。しかし、個人的には安易にプラグインを使うのではなく、自作できるものは自作できるよう心がけています。 今回紹介するのは前からよく使われている方法ですが、プラグインで実装している人も多いようなので紹介します。自分で作った方が自由ですし、無駄に大きなファイルにならないのでいいかと思います。 今回はボタンが現れるパターンを3種類作ってみました。定番のフェードインして現れるものと、CSS3を使ったものがあります。まずはサンプルをご覧ください。 HTMLは全て同じです。 <a href="#" id="page-top1">上に戻る</a> 非常にシンプルです。 では、CSSとiQueryを1つずつ解説します。 1. フェードイン まずはとても有名なやつです。ある程度スクロールするとフェードインして現れます。CSSは次のようになります。サンプルは
jQuery slideViewerPro 1.5
slideViewerPro 1.5 A 'pro' jQuery image slider built on a single unordered list. Cool! What's this? slideViewerPro is a fully customizable jQuery image gallery engine wich allows to create outstanding sliding image galleries for your projects and/or interactive galleries within blog posts. slideViewerPro is the direct descendant of the popular jQuery slideViewer plugin. Each gallery generates a us
簡単で高機能！デザイナー必見の汎用性が高いjQueryプラグイン7選 | 株式会社LIG(リグ)｜DX支援・システム開発・Web制作
こんにちは。LIGフィリピン支社代表のせいと(@seito_horiguchi)です。 最近、いろんな先輩方から「お前服だっせえな」と言わるので、ファッションの傾向を泣く泣く変えました。嵐の相葉君をお手本にこれまで頑張って参りましたが、相葉君には近づけませんでした。無念。 さて、今回はさまざまなシーンで活用できる、汎用性の高いjQueryプラグインを7つほどご紹介させていただきます。簡単＆シンプルで優れた機能のものばかりなので、ぜひご覧ください。ダウンロードできる本家サイトのほかに、日本語で分かり易く解説してくださっているサイト様のURLも合わせて載せておきます。 1.世界一使いやすいスライダー”bxslider.js” カスタマイズ豊富で、設置の仕方も超簡単！弊社CTOづやさんのオススメでもあります。 フリック、スワイプも対応しています。最強すぎます。 ダウンロード：bxslider様
jQuery Content Slider | Responsive jQuery Slider | bxSlider
Add a respsonsive image slider to any website.
jQueryのtoggleでアコーディオンメニューやタブをさくっと実装する方法 | 株式会社LIG(リグ)｜DX支援・システム開発・Web制作
こんにちは。LIGフィリピン支社代表のせいと(@seito_horiguchi)です。 最近友人と『中学生円山』を観に行きました。 女性にはおそらく理解できないであろう「男子中学生あるある（主に下ネタ）」が盛り込まれていて、いい意味でヒドイ内容でした。もう一回観たい（´ω`） さて、今回は「HTMLとCSSはわかるけどjQueryってなにそれ、おいしいの」という方向けに、今日から使える簡単かつ便利な3つのメソッド「slideToggle／fadeToggle／toggleClass」をご紹介します。 こいつらを知っとくと下記のようなメリットがあります。。 アコーディオンメニュー、タブ、スマホサイトでよくある「上からスラスラ出てくるメニュー」とか実装できる 超シンプルな記述なので、今日から使える いやーこれは便利ですね。 というわけで、早速解説していきます。 【こちらもおすすめ】 超簡単jQ
jQuery：よく使用される機能をまとめて実装できるプラグイン - NxWorld
スムーススクロール・タブ切り替え・ロールオーバー・アコーディオンなどといった、サイト制作時によく使われる機能をまとめて実装することができるjQueryプラグインのまとめです。 予め使用する機能がはっきりわかっていれば、こういった便利なものを使用することでファイルの散乱も防げますし、管理もしやすくなりますね。 紹介するプラグインの中には必要な機能だけを選択してダウンロードできたりもします。 yuga.js web制作を優雅にするために作られたjQueryプラグインで、7種類の機能が実装されています。 ライセンスはMIT Licenseで、ライセンスに従う限り許可なく自由に使用できるそうです。 機能 ロールオーバー 現在のページをハイライト表示 外部リンクを別ウインドウで開く 画像をthickboxで表示（thickbox.jsを使用） スムーススクロール タブ機能 CSS3の擬似クラスをクラ
画像を徐々に読み込みながら、タイル状に並べていくjQueryプラグイン「stalactite」
twitter facebook hatena google pocket Pinterestが流行ってからタイル状に配置するデザインが増えました。 新はてブのように目線がばらつくという指摘もありますが、画像だけを見せるのであれば有効な手段なのではないでしょうか。 今回紹介する「stalactite : A jQuery plugin」では、画像だけでなく、iframeなども徐々に読み込んでいくというエフェクトもかけてくれます。 sponsors 使用方法 stalactite : A jQuery pluginからファイルをダウンロード。 下記のようにJavaScriptを記述します。 <script type="text/javascript" src="/test/js/jquery-1.8.3.min.js"></script> <script type="text/javascr
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
emiac-works.com
jQuery.scrollTo
Flatis
ajaxzip3 - Google Code
5509.me