2011年12月14日15:34 カテゴリTipsLightweight Languages javascript - めんどうな作業がわずか1クリックに!新人プログラマーが知らないと一生後悔するブラウザーを使ったHTML生成 いいえ、使いません。 めんどうな作業がわずか数秒に!新人デザイナーが 知らないと一生後悔するExcelを使ったHTML生成 | Webロケッツマガジン 僕たちプログラマーは、ちょっとしたコード生成に、Excelを使います! 僕たちプログラマーは、ちょっとしたHTML生成にDHTMLを使います。 DEMO TSV JSON JSON to HTML function (json){ var tbody = $('<tbody>'); $.map(json, function(row){ var tr = $('<tr>'); $.map(row, function(c
Let’s say you have a bunch of images you want to display, and the goal is to get them edge-to-edge on the browser window with no gaps. Just because you think that would be cool. They are of all different sizes. You don’t care if they are resized, but they should maintain their aspect ratio. Like this: Nice and seamless Ideally we keep it pretty chill on the markup, like: <section id="photos"> <img
The Five Simple Steps website has a responsive design with a neat feature. When the browser window is narrow, the menu in the upper right converts from a regular row of links into a dropdown menu. When you’re on a small screen (iPhone shown here) and click the dropdown, you get an interface to select an option where each option is nice and big and easy to choose. That sure makes it easier to pick
少しのコードで実装可能な20のjQuery小技集素敵な動きを手軽に実装できるJavaScriptライブラリ「jQuery」。jQueryには多くのプラグインが揃っていますが、今回はプラグインなしで実装できるjQueryの小技を紹介します!「jQueryってなんだ?」という人もコピペで実装できますよ!サンプルも用意したのでぜひご覧ください! 追記:この記事で紹介されているいくつかの方法が、今では CSS のみで実装可能です!詳しくは「かつては JavaScript を利用していたものの、今では CSS のみで実装できる 10 の小技」をご覧ください。 jQuery の基本的な使い方まずはjQuery 本家から jQuery ファイルをダウンロードします。<head> 内に下記を記述し、jQuery ファイルを読み込みます。 <script type="text/javascript" src
2010年08月19日01:00 カテゴリ書評/画評/品評Lightweight Languages $(DHTMLcoders).read(this) || throw your.job - 書評 - jQueryクックブック オライリー矢野様より献本御礼。 jQueryクックブック jQuery Community Experts / 株式会社クイープ訳 [原著:jQuery Cookbook] これでなくなった。 jQueryを使わない理由が。 DHTMLを利用する全ての人、必携。 特にHTMLやCSSを書いても、JavaScriptはそれほど書かない人。これであなたにも書けるようになります。 本書「jQueryクックブック」は、今や最重要のJavaScript Libraryといっても過言ではないjQueryの手引書。 目次 まえがき - John Resig はじめに jQuer
exTOC は、ページ内の Hn 要素(h1 - h6)に対し、ページ内リンク付きの目次コンテンツを自動生成する jQuery プラグインです。 以下のような特徴があります。 目次 / Hn 要素に対する付番機能 ページ内リンクのスムーススクロール 高いカスタマイズ性 以下は exFixed Plugin / Easing Plugin を併用したデモです。 Demo 導入方法 jquery.js extoc_1_0.js 上記 js ファイルをダウンロードしヘッダー定義内で下記順で jquery.js / extoc.js を読み込みます。 <script type="text/javascript" src="path/jquery.js"></script> <script type="text/javascript" src="path/extoc.js"></script> 目次
jQueryはよく使うのだけど、ちょっとだけ不便なときがあったので、それに対応する関数を書いてみた。 クラスを生成する var Class = $.klass({ init: function (a) { this.a = a; }, view: function () { alert(this.a) } }); initがコンストラクタとして機能します。 $.klass=function(a){var b=function(){this.init&&this.init.apply(this,arguments)};b.prototype=a;return b}; CSSルールの追加削除 var index = $.css.add("body{background:red;}"); alert("stop"); $.css.remove(index); あると便利なときがあるので一応。 $
One method that I’ve been wanting for quite a while now was a simple way to format old JavaScript dates in a “pretty” way. For example “2008-01-28T20:24:17Z” becomes “2 hours ago”. Here’s some more examples: prettyDate("2008-01-28T20:24:17Z") // => "2 hours ago" prettyDate("2008-01-27T22:24:17Z") // => "Yesterday" prettyDate("2008-01-26T22:24:17Z") // => "2 days ago" prettyDate("2008-01-14T22:24:1
JSONを取ってきて、そこからJavaScriptで動的にHTMLを組み立てていくような場合、 $('#content').html( $('<table>').attr( { id: 'items' } ).html( $('<tr>').append( $('<th>').html( 'Header' ) ).append( $('<td>').html( 'Data' ) ) ) ); とか書くのが面倒だなーと思った。このへん、MochiKitはいい感じに書けたよね。 何かいい手はないかとremedie.jsを読んでみたら、これが使われてた。 jQuery Plugin - FlyDOM: Create DOM on the Fly さっきの例だと、 $('#content').empty().createAppend( 'table', { id: 'items' }, [ 'tr
ブログを書こうと、夜な夜な実験したり調べごとしたりしているのですが、 最近眠気に負けて、パソコンに向かったまま寝てしまっているという日々。 以前からあったのですが、最近とくに多くて体中が痛かったりします。 そんな余談はいいとして、先日エントリーした 「ブログでブログパーツやプラグインを入れる際の注意」 のコメントにて、いつもjQuery関連でお世話になっているcyokodogさんが 対処方法を書いてくださいましたので、自分も知っていたのですが 復習ついでに動作確認をしてみました。 2009/02/20 7:10追記 本文の一部を追記しました。 jQuery.noConflict()を記述しない場合 一応jQueryとprototypeがどちらも読み込まれている環境でのお話です。 ■ソース (function($){ $('#test1 button').toggle(function(){
JavaScriptSilverlightコンテンツを埋め込むjQueryプラグイン - Programmable Life で困ってたので一緒に悩んでみた。でも何故かIEでは動かない。誰か動くようにしてけれ!Silverlightコンテンツを埋め込むjQueryプラグイン - Programmable Lifeobject を作れていない?手元に環境を作って動かしてみると、 に を追加するところで JavaScript エラーが出る。状況を切り分けるために、 を追加する部分をコメントアウトしてみた。IE DOM Explorer で眺めてみると DIV タグが追加されている。どうやら var obj = $('').attr({ ... }); のところで object タグが作られていないようだ。jQuery でよく見る現象だ。こういうときは閉じ括弧を入れてあげると大抵うまくいく。
Get every type of asset for any type of project, and access to AI tools From $16.50/m
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く