atomicbox

Macでウェブ制作するための開発関連メモを残していきます。(html/JavaScript/jQuery など)

Category: JavaScript・jQuery

【jQuery】カスタマイズも簡単。定番スライドショーはbxsliderで

WEBサイトを作るとき、何かと入れる機会の多いスライドショー。簡単なようで、デザインを変えたいからといってゼロベースで作りだすと、意外に作るアクションも多くて大変です。

今回は、筆者がよくお世話になっている簡単設置・多機能・スマホにも対応、そして簡単なカスタマイズも対応しやすいおすすめスライドショーjQueryプラグイン・bxSliderをご紹介します。

Continue reading

【jQuery Plugin】透明画像のパラパラアニメが作れる SwitchAmimeChan

数枚のパラパラアニメが作れるスライドショーが欲しかったのですが、いいのが見つからなかったので作りました。
背景が透けて見える、透明画像をつかったパラパラアニメにも対応しています。

デモ用ページを作ったのでご紹介します。
デモとしてニュンニュン動いているロングなうさぎさんは、デザイナーの友人・ガーナさんに描いてもらいました。
どうもありがとう(^^)

スクリーンショット 2014-12-12 18.00.04

SwitchAmimeChanのデモページとダウンロードはこちらです。

SwitchAmimeChan – jQuery Plagin

一覧がさみしいので、まず5個くらいは作れたらいいな〜という目標でポツポツ作っていきます。
2014年残すところも少なくなってきましたが新年を迎えるまでがんばっていきましょう!

おわり

【Javascript・jQuery】オブジェクトや画像の幅・高さを取得する方法

オブジェクトや画像の高さ・幅を取得したい機会はけっこう多いのですが、この「サイズ」の概念は思った以上に複雑で結構悩まされます。
取得した値が思った値じゃない!ってこと結構ありますよね。今回はそこらへんについてまとめておこうと思います。

Continue reading

【jQuery Plugin】自作プラグイン一覧ページ作りました

先週に引き続きjQueryいじりしています。

jQueryプラグインの配布用ページをつくりました。
今後追加するときはここに情報を増やしていこうかな〜と思っています。

Continue reading

【jQuery Plugin】シンプル横方向スライドショー SlideChan

気がつけばもう2014年も終わりに近いですね…色々やっていることをまとめて残していきたいところです。
そのうちのひとつというにはやっつけですが、プラグインがひとつそこそこ形になったのでデモページも作ってGitHubにアップしてみました。

jQueryプラグインの、スライドショー「SlideChan」です。

Continue reading

【jQuery】ローディング・画像のプリロードを実装する

最近全画面表示のパララックスを使ったちょっぴりリッチなコンテンツを作る機会があったのですが、要素や初期化処理がそこそこ多くてローディングがないとサイトに訪問した瞬間に何かグチャグチャ動作するのが見えてかっこ悪い。

「読み込み中…56%」とかそんな感じのゲージとかを表示したい時なんかにも実際のロード状況がわからないと作れないなぁということで画像のプリロードなどのロード処理について調べてみました。

Continue reading

【jQuery】jQuery入門・基本の使い方(導入編)

htmlで簡単なウェブページが作れるようになってくると、ボタンをクリックしたら要素がアニメーションしたり、写真が自動的に切り替わったりできたらいいのにな〜と思いませんか?
今回は、ウェブサイトをちょっとリッチにできる、「jQuery」というものについて簡単にご紹介します。

Continue reading

【jQuery】jQueryの小ネタ(カプセル化、プラグイン化など)

jQueryを使う時の小ネタ集。断片的ではありますが、随時追記していきます〜。(記事の日付は最終更新日にしています。)

Continue reading

© 2017 atomicbox

Theme by Anders NorenUp ↑