色をアニメーションで変更する「jQuery Colorプラグイン」
配布元:jquery/jquery-color · GitHub ライセンス:MITライセンス jQueryのanimateメソッドは、top、bottomやmargin、padding、width、heightなどの数値を指定できるプロパティをしかアニメーションさせることはできませんが、jQuery Colorプラグインを読み込むことで色に関してもアニメーションで変化させることが可能になります。 利用方法 jQuery本体とダウンロードしたjquery.color-2.1.1.jsを読み込むことで、色に関してアニメーション指定が可能になります。 次のサンプルでは#d1がクリックされた際に#d1の色を赤から白にアニメーションして変更しています。 $("#d1").click(function(){ $(this).animate({ "backgroundColor":"#FFFFF" }
ブログに記事を書いたことをFacebookに投稿するプラグイン（その1）
2024年2月1日 拙作プラグインの譲渡について 拙作のMovable Typeのプラグインを、株式会社ワールドイズマインに譲渡いたしました。 長きにわたり拙作のプラグインをご愛顧いただき、ありがとうございました。 Movable Typeでブログに記事を書いたときに、その記事の要約等の情報をFacebookの自分のウォールに自動的に投稿するプラグインを作りました。 その使い方のうち、今日はFacebookにアプリケーションを登録するまでの手順を解説します。 1.登録を始める まず、Facebookにログインした状態で、Facebookの開発者のページに接続します。 初めて接続する時には、「開発者」アプリケーションを許可することを求められますので、「許可する」のボタンをクリックします。 開発者ページに接続すると、右上に「Set Up New App」のボタンがありますので、それをクリックし
スクロールで順に画像読み込みLazy Load Plugin for jQuery
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
パララックスをサクッと作れるskrollr
「skrollr」は、パララックス（視差効果）を簡単に実装できるプラグインです。 サンプルの動画を見ていただければわかりますが、非常に多彩なエフェクトが用意されており、基本的なパララックスサイトであれば、サクッと作れます。 step1 jQueryプラグインの読み込み jQuery本体をjQueryの公式サイトから、skrollrを配布ページからダウンロードしましょう。skrollrはGitHubで公開されており、ページ右下の「Download ZIP」というボタンからダウンロードします。 jQuery本体と「dist」フォルダに入っている「skrollr.min.js」を、利用するWebページのbodyの閉じタグ直前で読み込みます。 //(中略) <script src="jquery.min.js"></script> <script src="skrollr.min.js"></sc
データベース内の文字列を一括置換するMovableTypeプラグイン：SQLReplace - エンジニアブログ - スカイアーク
なぜか一度書いた記事が全部消えて同じ記事を２回書いているonagataniです。 さて、皆さんMTでの開発で最終的な本番化をおこなう際に公開ドメイン名やパスが違うために困った事はありませんか？管理画面でもある程度は一括置換できますが記事内の画像のリンクなどで漏れがでてしまうかと思います。 ということで、直接データベースの全テーブル・全カラム（varchar型、text型のみ）に対して置換処理を行なうSQLReplaceプラグインを紹介します。 本プラグインを導入する事により、MovableTypeのデータ全てに対して置換処理を行なうことが可能になります（導入前にかならずデータベースのバックアップを取得して下さい。動作保証はありません）。 使い方はシステムのプラグインセッティングにて「置換前文字列,置換後の文字列」と書くだけです。あとはrun-periodic-tasksが置換処理を実行して
Textillate.js
About Textillate.js combines some awesome libraries to provide a ease-to-use plugin for applying CSS3 animations to any text. Usage Simply include textillate.js and it's dependencies in your project to start creating unqiue effects. Credits Textillate.js is built on top of the simple, yet amazingly powerful animate.css and lettering.js libraries.
[JS]ページのデザインに影響を与えないパーフェクトなスクロールバーの超軽量スクリプト -Perfect Scrollbar
Perfect Scrollbar Perfect Scrollbar -GitHub 何をもってパーフェクトなのか Perfect Scrollbarのデモ Perfect Scrollbarの使い方 何をもってパーフェクトなのか このスクロールバーにパーフェクトとつけた理由は、下記の4つだそうです。 ページ上のあらゆる要素にCSSで影響を与えないこと スクロールバーがオリジナルのデザインに影響を与えないこと スクロールバーのデザインは完全にカスタマイズ可能であること コンテンツの大きさが変化したら、スクロールバーの大きさと位置がそれに合わせて変化すること Perfect Scrollbarのデモ デモではあずにゃんの画像をホバーすると、スクロールバーが表示されます。 デモ：領域を拡大 バーの長さが変化していることに注目してください！ Perfect Scrollbarの使い方 Step
Ben Alman » jQuery hashchange event
This jQuery plugin enables very basic bookmarkable #hash history via a cross-browser HTML5 window.onhashchange event. While this functionality was initially tied to the jQuery BBQ plugin, the event.special window.onhashchange functionality has now been broken out into a separate plugin for users who want just the basic event & back button support, without all the extra awesomeness that BBQ provide
【ECサイトでよく見る「レコメンド機能」を感覚的に導入できるWordPressプラグインを作りました】｜今村だけがよくわかるブログ
2016/06/16追記※「Submit! Recommend」プラグインは提供を終了いたしました。以下の内容は公開当時のものです。 ちょっと前から、新しいWordPressプラグインをコツコツと作っていまして。つい先日、リリースとなりました。プラグイン名は「Submit! Recommend」といいます。 このプラグインは、AmazonなどのECサイトでよく見る「レコメンド機能」をWordPressに感覚的に導入できるものです。 以下、ご紹介します。少しでも興味がありましたらご覧ください。 プラグインのダウンロード＆インストールWordPress.orgで公式に配布されています。早速、プラグインをWordPressに導入しましょう。 割と手順がわかりやすい方法は、WordPressの管理画面からインストールする方法です。 まず「プラグイン」→「新規追加」をクリックします。検索ワード「Su
管理画面内でスマフォやタブレット別にCSSを書けるWordPressプラグイン・Mobile CSS
ちょっと便利そうだったので 備忘録。スマフォやタブレット のデバイス別にそれぞれに適応 させたいCSSを管理画面内で 書ける、というWordPressの プラグインです。 スマフォでもiPhone用、Motorola用、タブレットならiPad用、Nexus用、Kindle用などのように細かく設定できます。 シンプルなプラグイン名ですが、かなりの数のスマフォとタブレットデバイスをサポートしています。個別にCSSを適応させられるのでコンテンツ次第では結構役立ってくれるかもしれません。 カスタム投稿タイプを応用してCSSを書く、と言う珍しい仕様です。いつも記事を書く場所にCSSを書き込みます。後は下部のメタボックスでデバイスを選択し、保存すればデバイスごとにCSSを適応させる事が出来ます。 他のデバイスに別のCSSを用意したい場合は、記事を追加する感覚で再度作ればいいだけ。メタボックスのセレクト
Blurjs.com - For Sale
Project Title Use this area of the page to describe your project. The icon above is part of a free icon set by Flat Icons. On their website, you can download their free set with 16 icons, or you can purchase the entire set with 146 icons for only $12! Client: Start Bootstrap Date: April 2014 Service: Web Development Close Project Title Use this area of the page to describe your project. The icon a
Antiscroll - os x lion style cross-browser native scrolling on the web that gets out of the way
os x lion style cross-browser native scrolling on the web that gets out of the way. supports mousewheels, trackpads, other input devices natively. total size is 1kb minified and gzipped. doesn't magically autowrap your elements with divs (manual wrapping is necessary, please see index.html demo). fade in/out controlled with CSS3 animations. shows scrollbars upon hovering. scrollbars are draggable.
[JS]これはかなりの優れもの！iOS用だけどIE7にも対応しているスライダーのスクリプト -iosSlider
iosSlider [ad#ad-2] iosSliderの特徴 iosSliderのデモ iosSliderの使い方 iosSliderの特徴 ハードウェアアクセラレイト iOS, Android, Webkit系ブラウザ用にCSS3を使用します。 レスポンシブデザイン デスクトップ、スマートフォン、タブレットの各デバイスをサポート。 コールバック ウェブアプリとしてさまざまな用途に応えるためにコールバックを用意。 全てのモダンブラウザをサポート デスクトップ用のFirefox, Chrome, Safari, IE7+をサポート。 無限ループ スライドは両方向に無限ループさせることもできます。 オートスライディング 自動スライドにも対応、ホバーで中断します。 サポートブラウザ iosSliderがサポートするテスト済みのブラウザ一覧です。 Firefox5.0+ Chrome19.0+
jQuery Knob
Demo jQuery Knob canvas based ; no png or jpg sprites. touch, mouse and mousewheel, keyboard events implemented. downward compatible ; overloads an input element. Example <input type="text" value="75" class="dial"> <script> $(function() { $(".dial").knob(); }); </script> Options Options are provided as attributes ‘data-option’: <input type="text" class="dial" data-min="-50" data-max="50"> … or in
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
darsa.in
Real Shadow: Photorealistic Shadows of any shape
http://joelb.me/scrollpath/
http://textextjs.com/
so-network.biz
stefangabos - Overview
