WebDesign Dackel

OwlCarouselとPhotoSwipeでモバイルフレンドリーなギャラリーを作る

OwlCarouselとPhotoSwipeでモバイルフレンドリーなギャラリーを作る

はじめに OwlCarouselとPhotoSwipe、どちらも細かい制御が出来てモバイル環境での動作も非常に軽快です。僕もよくお世話になるお気に入りのライブラリです。 それぞれ別々で使うことはありま...

jQueryで画像がPC画面をスライドしていくようなエフェクトを実装する

jQueryで画像がPC画面をスライドしていくようなエフェクトを実装する

はじめに 今回は、画像がPC画面の中をスライドしていくようなエフェクトをjQueryを使って実装してみたいと思います。 たまにポートフォリオサイトなんかで見かけるやつです。 数行の簡単なコードで実装で...

【初心者向け】jQueryでツールチップのプラグインを自作しよう – Part3

【初心者向け】jQueryでツールチップのプラグインを自作しよう – Part3

はじめに これまでPart1、2とやってきましたが、今回で「jQueryでツールチップのプラグインを自作しよう」シリーズも最後です! 今回は、前回のPart2でプラグイン化したコードを更に発展させて、...

【初心者向け】jQueryでツールチップのプラグインを自作しよう – Part2

【初心者向け】jQueryでツールチップのプラグインを自作しよう – Part2

はじめに 前回はプラグイン無しでツールチップを表示するところまで進めました。 いよいよ今回から、jQueryプラグインとして機能をまとめていきたいと思います。 恐らくここが、Part1~3の中で一番ワ...

【初心者向け】jQueryでツールチップのプラグインを自作しよう – Part1

【初心者向け】jQueryでツールチップのプラグインを自作しよう - Part1

はじめに 最近のフロントエンドではjQuery離れがささやかれたりしていますが、そんな中僕が通っていた専門学校の生徒(在校生)さんにjQueryを教える機会がありました。 (大したことは教えてあげられ...

jQueryでプラグインを使わずにそれなりにちゃんとしたスムーススクロールを実装する

jQueryでプラグインを使わずにそれなりにちゃんとしたスムーススクロールを実装する

はじめに いきなりですがjQueryでスムーススクロールを実装した事があるでしょうか? きっと沢山の人が実装したこと、使ったことのある機能だと思います。 ちょっと調べて出てきたサンプルのコードをコピペ...

jQueryとCSSのclipプロパティを活用して、ここまで白ここから黒、みたいな表現を作る

jQueryとCSSのclipプロパティを活用して、ここまで白ここから黒、みたいな表現

はじめに いきなりですが、タイトルが若干意味不明ですね。良いタイトルが思いつきませんでした。 やりたいことは単純で、下の画像みたいな感じなことです。 実はこのブログの画面右上のメニューボタンにも試験的...

jQueryの画像切り替え用プラグインをバージョンアップしました

jQueryの画像切り替え用プラグインをバージョンアップしました

去年の暮れ、空港で飛行機を待っている間に勢いで書いてから、放ったらかしになっていたjquery-image-changer.jsをちょこっとアップデートしましたので、一応ブログに残しておきたいと思いま...

Zeptoにも対応、スムーズスクロール用jQueryプラグイン「jquery.sweet-scroll.js」を書いた

Zeptoにも対応、スムーズスクロール用jQueryプラグイン「jquery.sweet-scroll.js」を書いた

世の中にある多くのWebサイトで見かける「スムーズスクロール」ですが、なかなか「これだ!」というプラグインが無かったので自作してみました。 プラグインを作った経緯 この手のプラグインは既に沢山リリース...

jQueryを使ったパスワードの強度判定用プラグイン、jQuery.pwdMeasure.jsを書いてみた

jQueryを使ったパスワードの強度判定用プラグイン、jQuery.pwdMeasure.jsを書いてみた

少し前にユーザが入力したパスワードの強度を判定して表示する、という要件がありました。 それで、何か良いプラグインは無いかなと探してみると幾つか候補があがったのですが、それぞれ良いところはあっても中々要...