Posted: 2011.04.28 / Category: javascript / Tag: jQuery, ギャラリー 最近はFlashで作ったのかと思ってしまうようなjavascriptなギャラリーをちらほら見るようになりましたね。 この記事ではあまり凝ったことをすると大変、、というか作れるスキルがないので、jQueryを使用したシンプルなフル画面ギャラリーの作成方法をチュートリアル形式でお送りいたします。 画像の準備をしよう ギャラリーページなので当然のことながら画像は準備しておきましょう。 小さい画像（サムネイル）と大きい画像を用意します。 小さい画像は100×67、大きい画像は画面いっぱいに表示するのでそこそこ大きいのにします。 画像サイズが変わっても基本的にcssを修正するだけで済むようにします。 html + cssを作成しよう 連番画像をjQueryで配置しても良かった

2012年のHTML5、CSS3、JavaScriptはこうなる〜実際のサービス事例で考えるHTML5の近未来 : ATND 2012/01/20 2012年のHTML5、CSS3、JavaScriptはこうなる〜実際のサービス事例で考えるHTML5の近未来 #html5semi - Togetter (写真：神保町駅改札前) HTML5関連ネタはやろうやろうと思いつつ個人的にはリーチ出来てない分野でして、ちょっくら拝見してきました。ちなみに上記の募集サイト、凄い人気で200人の定員に一時は倍の400人が登録すると言う事態に。HTML5人気は凄いですね〜。 開催開場は株式会社オプト１F大会議室＠神保町。この日は朝から雪が降るなどして天候が崩れていましたが、夕方〜開催の頃には問題無く止んでおりました。しかし外は寒かった！(>_<) 入場時の状況で5分程遅れて本編スタート。以下メモです。 基調

大規模UIをJavaScriptで実現するためのテクニック、サイボウズkintone開発の現場から。デブサミ2012 7万行規模のJavaScriptプログラムで構築されたユーザーインターフェイス。そのプログラミングで使われたテクニックとはどういうものか。 2月16日、17日の2日間、都内で開催されたイベント「デベロッパーズサミット2012」（デブサミ2012）で、サイボウズ株式会社 開発部 若原祥正氏、生駒浩隆氏が講演「kintoneの表と裏～大規模JavaScript開発と非構造データベース」を行いました。 講演では前半に大規模JavaScriptのテクニック、後半でスキーマレスデータベース構築の仕組みが解説されましたが、この記事では資料が公開された前半のJavaScriptのテクニックについて、ダイジェストで紹介します。 7万行のコード、フレームワークはClosure Library

HTMLにて、tableに下記のスタイルを指定すると、CSSの見た感じがわかりやすく簡単で、レンダリングもきれいにできているように見えます。 table {border-collapse:collapse;} td, th {border:1px solid #000000;} border-collapse:collapse; の指定は、境界線の共有。 1pxの境界線を共有するということは、計算上隣接するセル同士で0.5pxずつ受け持つことになります。 この指定によって、Firefoxで上の境界線、左の境界線が消える、期待する位置から1pxずれるといった問題が発生します。 ★ ★ ★ こちらをおすすめします。 ★ ★ ★（IE6非対応。CSSハック入りは下に追記。） table { border-collapse: separate; border-spacing:0; empty-ce

Web 制作のことを中心に、ちょっとした Tips などを掲載しています。「自分用メモ」が基本スタンス。 btmup Blog 珍しく Firefox のバグです（だと思います）。 あえて「解決法」ではなく「対策」としたのは、解決したかどうか定かではないからです。 つまり、「よく分からんけど、とりあえずうまくいってるっぽい」と。 発生した現象はタイトルの通りですが、テーブルに設定した線が、Firefox で見てみると表示されたりされなかったりするのです。 「されたりされなかったり」とは言っても、表示のたびに結果が変わるということではなく、再現性はあります。 ただ、文字サイズを変えたり行間を変えたりパディングを変えたりすると、表示される線と表示されない線が違ったりするということです。 色々な数値を微調整していけばすべての線がちゃんと表示されるポイントがあるかも知れませんが、環境が異なればまた

ウェブサイト高速化勉強会 : ATND 2012/09/29 ウェブサイト高速化勉強会 #tnmk0929 - Togetter さくらのVPSにてサーバ＆ドメイン取得を行った流れもあり、個人用鯖にも何らかのWebコンテンツを配備・公開して行く事になるだろう(てかそういう風にして行きたい)と言うのもあり、ちょうど目にしたこちらの勉強会に目が留まり、参加して来ました。 なので現状のWebサイトを高速化させるために、ってのではなくて今後のために、という意味合いが強いですね。 会場は横浜タネマキ。最近は個人的にはYokohama.groovy等で2週間に一遍は使ってる感じですね。 タネマキ 【コワーキング ＆ シェアオフィススペース】 開始間際、ディスプレイ接続で調整が上手く行かず10分程押した後スタート。 Web Site Optimization for Beginners こもり まさあき

WordPress で運営しているサイトに、Facebook の「いいね！」やコメント欄、Twitter の「ツイート」などを追加する場合、プラグインを使わずに直書きしてしまった方が何かと幸せになれます。 WordPress には「WP Social Bookmarking Light」という、ソーシャルボタンを一括で追加できるプラグインがあります。日本ではあまり使わないものが多く重いことや、Facebook の仕様が頻繁に変わるので、プラグインのアップデートが行われるまでに不具合が発生してしまう問題があります。 共通の設定など それぞれの JavaScript は、footer.php の </body> 前にまとめて書いておくとスマートですね。 WordPress で、ページの URL を取得するタグは <?php the_permalink();?>、タイトルを取得するタグは <?p

実害はなかったんですが、何だか気持ち悪かったので調べてみました。 環境 Firefox 15.0 Firebug 1.10.3 jQuery 1.8.1 現象 jQuery1.8.1を読み込むと、Firebugのコンソールに chrome JS オブジェクトを __exposedProps__ を含めずに開示することは安全でないため推奨されません。 というエラーが出力される。 原因 #12418 (Firefox 15.0 __exposedProps__ is deprecated) – jQuery - Bug Trackerによると、 I was having the same issue, but this is not a JQuery problem. It is a problem of one of your add-ons. One of the add-ons shar

When I just started out in eCommerce, I desperately wanted to push maximum products to buyers. That’s why I filled the homepage of my store with as many items as possible. The more products I’d show, the wider choice they’d have, the more chances there’d be to make a sale. That’s what I thought. But as my inventory grew, the homepage of my store became so cluttered that it started loading much slo