bl6.jpホームニュースレビューお出かけアプリウェブサイトMacカメラレタッチTips雑記bl6.jpファッション、写真、旅行、ガジェットなどの備忘録menuホームJavaScript画面全体に背景を表示させフェードやスライドもできるjQuery「bgStretcher」JavaScript2012.05.10画面全体に背景を表示させフェードやスライドもできるjQuery「bgStretcher」ブラウザの画面全体に背景を表示させることができるjQueryプラグイン「bgStretcher」を使ってみました。画像を複数指定することでフェードやスライドで切り替えたり、ページナビをつけたりと機能も充実しているかと思います。いうことで以下使い方です。[ads_center]使い方いつも通り、head内にjQuery本体とダウンロードしたプラグインファイルを読み込んでいきます。src="../bgstretcher.js"></script>そしてbgStretcherの設定をします。bodyに背景をセットするには以下のようにします。});});</script>これだけで設定した画像が表示されるようになります。ページネーションをつけたいオプションで指定することでページナビなんかもつけることができます。});});</script>で、ページナビを表示させたいとこに以下のように記述します。id="nav"></div>この他にもprev、nextで背景を切り替えたり、スピードを設定したりといった便利なオプションが色々あります。シンプルで使いやすいプラグインですね。Backstretchというのを紹介しました。こちらも使いやすくてオススメです。実際に使う場合は両方を試してみて自分に合うものを選択していけばいいかと思います。Backstretchを使えば超簡単にブラウザサイズに合った背景画像を表示できる今回の実際のデモやダウンロードは公式サイトで確認することができます。)この記事へのコメントはありません。この記事へのトラックバックはありません。URL返信をキャンセルする。-URL検索:プロフィールbl6.jp心がときめく「モノ」や「コト」を中心に紹介しています。レビューや日記なんかも。TwitterFacebookInstagram最近の記事2020.02.18成城石井オリジナルコーヒー豆「ブラジルイパネマ」アマゾンで買い物中に見つけた成城石井オリジナルコーヒー豆「ブラジルイパネマ」。...2020.02.17梅しば1年のどこかで無性にカリカリ梅を食べたくなる時期がある。先日もこの症状が生じてし...2020.02.15ハンドル付きのノートPC用インナーバッグ「エレコム...エレコムから出し入れしやすいハンドル付きのノートPC用インナーバッグが登場しまし...2020.02.14白銀の千秋公園スタバをあとにして朝の散歩をするために千秋公園へと向かった。今シーズンはいままで...2020.02.13日常の休日。スタバで温かいドリップを久しぶりの秋田のスタバ。いっても元旦以来だから約1カ月ぶりか。