小さい画像をクリックしたら大きい画像が表示される、というのは、よく欲しくなるプログラムです。ライトボックスにはしたくない場合がままあります。スマホサイトでライトボックスされると割と鬱陶しい。Googleの画像検索の如く、クリックしたら下に大きな画像が出てくる感じにしようと思います。false;})});これに対応したHTMLはこんな感じです。img{vertical-align:middle;max-width:100%;max-height:100%;width:auto;height:auto;}jsの解説はソース上に書いた通りです。大きな画像は.oneの最下部に表示されるため、.oneを小分けにしておくのがおすすめ。Googleのようにレイアウトを崩さず画像のすぐ下に出てきてくれます。.imageZoneのCSSですが、必須なのは初期のdispayをnoneにしておくこと。これをしないと表示されるときにスライドで出てきてくれません。あと、heightを設定しないと、slideDownのときの動作がガタつきます。Googleのように、画像以外のメタ情報も表示したい!という場合は、imgのalt辺りに情報を記載してクリック時に取得、elementの中に出力してしまうと良いでしょう。このCSSは画像のみの場合のものなので、displayとheightのことだけ忘れずに残りは全部変えてしまいます。javascript)jsの連想配列をソートしたかった話。maxlength属性みたいにinputでバイト数制限するIEはfor..ofループ使えないし、IE8はarray.indexOfすら使えないscriptタグの中のURLはHTMLエスケープしちゃダメ...のはずが。$(document).keypress(function(){})はスマホの個体差で爆死することを僕は学んだ。通勤途中、大通り沿いの耕作放棄地と思われるところで、厚化粧の若いねーちゃんたちが何かしていたので見てみれば、なんと早朝からゴミ拾い。ゴミ袋は既に半分ほど埋まっていた。自分はゴミのポイ捨てなどとてもしないが、それでも頭が下がる思いだ。闘うfilter:drop-shadow()を複数適用するOfiice2010画像挿入時に「このファイルのインポート中にエラーが発生しました」Amazon商品のProductTypeを調べたい話。jsの連想配列をソートしたかった話。RPGの「敵組織」って大別すると4パターンくらいな話。創作ど素人考察WP5.2.3でquery_posts()やwp_reset_query()が本格的に死んだんだね。脱プラグイン?ぱんくず関数を作ってみる。maxlength属性みたいにinputでバイト数制限するselectタグ、中身が半角と全角の場合で位置がズレる問題。●お問い合わせ○d66をいっぱい振ってくれるツール人気エントリー[Excel]ファイルの破損が深刻なので修復できません。ファイルが保存できないメモExcel慣れしてる人がハマる、googleスプレッドシートの「解析エラー」ブラウザバックしたらjs(jQuery)のイベントが起こってくれないとき、こうすると解決するかもしれない。YMMで作成したファイルをAviUtlにエクスポートするときの初歩的なトラブル対策SQLでJOINするカラムを条件分岐させようとした話inputに半角だけ入力させたいよく陥る「シンボルを見つけられません」の原因覚え書き[MySQL]複数行のUPDATEを1回のSQL実行で済ませたい。[MySQL]warning1292が出たので困ってたらすっごいケアレスミスだった話。Googleの画像検索っぽく、画像をクリックしたら大きな画像を表示したい厨二心を忘れられないプログラマー見習いのブログ。javaWebwebの話。過去記事はWordPress多め。この頃はPHPメイン。C++TRPGTRPGの話。充実させたい(切実)。Game,Taleゲームや漫画、小説などの感想や語り。更新頻度が非リアぶりを物語る。Otherその他の話題。どこに突っ込むか悩んだ記事が行き着く場所。