はぴらき合理化幻想

海外3年/西成ドヤ2年/沖縄2年/事故物件で寝袋3年目、ミニマリスト10年目でダンボール2箱の持ち物と保存食で大阪に定住中。

フリー素材の齊藤貴義社長アイコン画像を背景画像で敷き詰めるサンプルコード3種類

齊藤貴義社長アイコン画像

株式会社参謀本部の齊藤貴義社長が改変可のクリエイティブコモンズで自由に使って頂いて大歓迎です。とおおせられたのでやっつけ仕事でやってみた。

概要

誰もが憧れる齊藤貴義社長のアイコンを画面いっぱいに敷き詰められるサンプルコードを作ったよ。画像の改変はだれかたのむ。

背景画像を記事ごとに変更するには

次の記事で詳細を確認できる。

ブログの記事ごとに背景画像を変更できるJavaScriptサンプルコード - はぴらき合理化幻想

齊藤貴義社長ご尊顔を背景画像にするコード

齊藤貴義社長アイコン画像

このページで実際に採用しているコードだよ。(jQuery不要ver)

<script>$(function(){
/*
ブログの記事ごとに背景画像を変更できるJavaScriptサンプルコード - はぴらき合理化幻想
http://hapilaki.hateblo.jp/entry/each-page-has-original-background
ver1.0.0.140529
*/
var body=document.getElementsByTagName('body')[0];
body.style.backgroundImage='url(http://cdn-ak.f.st-hatena.com/images/fotolife/h/hapilaki/20140529/20140529233143.gif)';
body.style.backgroundAttachment='fixed';
</script>

この記事公開時のキャプチャー画像。タッチで別タブで拡大表示可能。

齊藤貴義社長を背景画像にしたページのキャプチャー画像

大きな顔

大きな顔用コード。(jQuery必要ver)

齊藤貴義社長

<script>$(function(){
/*
ブログの記事ごとに背景画像を変更できるJavaScriptサンプルコード - はぴらき合理化幻想
http://hapilaki.hateblo.jp/entry/each-page-has-original-background
ver1.0.0.140529
*/
$('body').css({'background':'url(http://cdn-ak.f.st-hatena.com/images/fotolife/h/hapilaki/20140529/20140529233308.jpg)','background-attachment':'fixed'});
});
</script>

サイバー サングラス

元祖、見つめられるお顔

マニアなあなたにはこのコード。(jQuery必要ver)

<script>$(function(){
/*
ブログの記事ごとに背景画像を変更できるJavaScriptサンプルコード - はぴらき合理化幻想
http://hapilaki.hateblo.jp/entry/each-page-has-original-background
ver1.0.0.140529
*/
$('body').css({'background':'url(http://cdn-ak.f.st-hatena.com/images/fotolife/h/hapilaki/20140529/20140529233743.jpg)','background-attachment':'fixed'});
});
</script>

じっと見つめる君は堕天使

このコードは次のページで使っているよ。

自分のコメントを一覧できるはてなブックマークの使い方がいいね!ブクマやブコメ歓迎! - はぴらき合理化幻想

齊藤貴義社長ってだれ?

今、はてなで人気沸騰中の素材を配布している人 。

まとめ

あなたのブログも齊藤貴義社長を並べれば、人気沸騰間違いなし!

てすとてすと