技術トレンドを追わないという勇気
技術トレンドを追わないという勇気 昨日、「第19回 HTML5+JS 勉強会 【オレオレフロントエンド開発環境 ～際限なき修正を攻略せよ！～/甦れFlasher「swf2js」でswfをリアルタイムでcanvasに出力】」というイベントに参加してきました。 そこで講師の沖さん(@448jp)が、�「技術は目的を達成する手段なので、あまり新しい技術に振り回されてはいけない。」的なことをおしゃっていて、それはそうだなと思いながら私が最近感じている事をすこし書き留めておこうと思います。 技術トレンド圧力 フロントエンド界隈ではJavaScript/node.jsの盛況もあって毎日のように新しいライブラリ/フレームワークやツールがリリースされています。そして、それらの技術に対してアーリーアダプター的なフロントエンダーが試してはブログやQiitaでレビュー内容を記事にしたり、TwitterやFace
「CSS Reloaded」CSS3の実践的な使い方をご紹介！の感想
「CSS Reloaded」CSS3の実践的な使い方をご紹介！の感想 先日、アップルストア心斎橋で行われたCSS Reloaded「CSS3の実践的な使い方をご紹介！」に行ってきました。 資料が公開されました。 ■出典元：CSS Reloaded ■著者；John Allsopp ■リンク：Web Directions East 以下、内容を復習もかねてまとめてみました。（サンプルやブラウザ対応などは私が補足したものです。） CSSの歴史 1996年ぐらいからありました。 2000年にCSSのサポートが良いMac IEが登場 2000-2005年はCSS3の開発がストップ 2000-2008年でブラウザが劇的にCSSに対応していく。(ブラウザ Reloaded) 各ブラウザはCSS3を試験的に実装 プリフィックスをプロパティの先頭につける事によってCSS3を実装することが可能。 Firef
IE8における拡大縮小バグ
IE8における拡大縮小バグ 先日リリースされたIE8だが、多くのバグを含んでおり、まだまだWEB製作者を悩ませそうです。 (追記)Firefox3でも発生しますね。検証不足でした。 例えば、私が見つけたのは拡大縮小に関するバグ。(文字ではなくズームによる) ul{ margin:10px; width:600px; border:1px blue solid; } ul li{ list-style-type:none; margin:2px; border:1px red solid; width:194px; height:194px; float:left; display:inline; } サンプル などのようにリスト要素を利用して表状の形態を表現した際、通常は以下のように表示される。 IE8 100%で表示。 これを95%に変更すると以下のようになる。 IE8 95%で表示。
8のjQueryのすごいTIPS
8のjQueryのすごいTIPS 原文：8 awesome JQuery tips and tricks 微妙なTIPSもあるのですが、役に立つのもあるのでご紹介。 target="_blank" のリンクの作成 XHTML 1.0 Strict ではtarget=blank属性が利用できない。そこでjQueryを利用して別ウィンドウを開く方法を紹介しよう。 $('a[@rel$='external']').click(function(){ this.target = "_blank"; }); <a href="http://www.lepinskidesign.com.br/" rel="external">lepinskidesign.com.br</a> [to-R補足] 実際に利用する際はjavascript部分を$(function(){...})などで包む必要があります。[
jQueryを良くする25のTIPS
jQueryを良くする25のTIPS ネタ元：Improve your jQuery - 25 excellent tips ちょっと多いですが、かなり良いTIPSがまとまっています。 Google AJAX Libraries APIを利用しよう Google AJAX Libraries APIを活用すればすばやくライブラリを読み込むことが出来ます。 <script src="http://www.google.com/jsapi"></script> <script type="text/javascript"> // Load jQuery google.load("jquery", "1.2.6"); google.setOnLoadCallback(function() { // Your code goes here. }); </script> 直接読み込むことも出来ます。
IE6で閲覧すると。のanalog.js
IE6で閲覧すると。のanalog.js ネタ元：IE6で閲覧すると。 という訳でIE6で見ると最新バージョンにアップデートするように促すJavaScriptライブラリを作ってみました。 利用方法は簡単、analog.jsをhead要素などで読み込んでください。 <!--[if IE 6]> <script type="text/javascript" defer="defer" charset="utf-8" src="analog.js"></script> <![endif]--> 条件付コメントとcharset属性、defer属性を忘れずに！ IEで見るとこんな感じで表示されます。 ご利用は自己責任でお願いします。 ライブラリ中の「アップロード」のtypoを「アップデート」に修正しました。 IE6向けには他にもこんなのがありますよ。 IE6で閲覧するとモノクロ Re: IE6を使っ
本気にonclick
本気にonclick 今onclickが熱いらしい。本気でJavaScriptを学びたい人は下記のサイトをご覧ください。 第1回：そろそろ本気で学びませんか？ 本気でやるならonclick属性は避けてライブラリを活用すべきCommentsAdd Star JavaScript のイベントハンドラCommentsAdd Star onclick 属性問題について 本気でやるならprototype.jsやjQueryやYUIは避けてonclickを使うべき 本気でやるならクロスプラットフォームは避けてMozillaアプリを作るべき onclickと本気とIE イベントハンドラを分離するUnobtrusive Scriptingという考え JavaScriptにはUnobtrusive Scriptingというスクリプティングの考えがあり、JavaScriptをソースコード上に記述するのは良くな
PHPの欠点
PHPの欠点 ネタ元：PHPがいかに駄目な言語か、という話。 定期的に起こる、PHPに関する議論ですが、今回はRubyのまつもとゆきひろさんが火種とあり結構な盛り上がりを見せています。 とりあえず、まとめ どの言語で書いてもおかしなコードを書く奴は書く。 404 Blog Not Found:「PHPなめんな」と「(Perl|Python|Ruby)をなめんな」の違い PHPとRubyについて Rauru Blog » Blog Archive » 悪いのはPHP自体じゃないかもしれないけど PHPやってるだけでバカにされるんですがどうしたらいいでしょうか。 - 人力検索はてな 「PHPは初心者に優しい」は不適切な宣伝文句 - 2008-01-29 - ひがやすを blog Matzにっき(2008-01-29): PHP使いの反論 Matzにっき(2008-01-29): 安全なWebア
yahoo!がリニューアルデザインのベータ版を公開
yahoo!がリニューアルデザインのベータ版を公開 yahoo!が2008/1/1にリニューアルされるデザインを先行して体験できるベータ版を公開しました。 新しいデザインの解説ページに移動して、『今すぐ新しいデザインを使ってみる』ボタンをクリックすると、TOPページはnew yahoo!のデザインと入れ替わります。 積極的にリニューアルデザインの情報を公開することは、リニューアル後のユーザーの混乱は軽減されるので、よい試みですね。 文章なども非常に見やすくなっており気に入ってます。エラスティックレイアウトなどの手法が取り入れられているのも素敵ですね。 また、日本一使われているサイトが『横幅950pxのレイアウト』であったり『下線のないリンク』などを採用したことは、業界に結構な影響をあたえるでしょう。 個人的に気になるところは、『Yahoo!カテゴリ』へのリンクがどのように変化したかなのです
mixiのjsライブラリ
mixiのjsライブラリ mixiが使ってるjsライブラリが素敵でした。 <script language="javascript" type="text/javascript" src="/static/js/prototype.js?1191207813"></script> <script language="javascript" type="text/javascript" src="/static/js/effects.js?1186571328"></script> <script language="javascript" type="text/javascript" src="/static/js/overlay.js?1186571328"></script> <script language="javascript" type="text/javascript" sr
Re:href=
Re:href="#" onclick の悪習 ネタ元：某日記：href="#" onclick の悪習 <a href="#" onclick="...">検索</a> なんて書き方やめようぜ！というお話 a要素のhref属性に値が入ってるとonclick属性の内容を実行後にhref属性の値を参照しようとする。 #なんかが入ってるとページの一番上部にページ内遷移をする。(※1) 某日記さんの代替案ですけどspanで代替するもの <span style="cursor: pointer" onclick="...">検索</span> 私だとこんな書き方 <a href="javascript:void(0)" onclick="...">検索</a> onclickイベントハンドラを実行しようとしてるなら、こんな書き方もある <a href="javascript:（onclickの内容
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
