jQueryでthisの子要素を取得するやり方いろいろ | Base Views
公開 2010年6月6日（日） 更新日 2014年8月18日（月） スポンサーリンク jQueryを使っていて、thisとその子要素を同時に指定したい場合がある。 結構いろんなやり方があるみたいで、取りあえず使いやすそうなので下の3通り。 $("hoge",this) $(this).children("hoge") $(this).find("hoge") 一番上がシンプルでいいかと思うんですが、取得したいthis直下の要素名をthisの手前に書くんですね… 使いどころは多そうですが、例えば下みたいなの。「Click1」をクリックしたらその直下の<div>が隠れるようにしたい場合とか。 <ul> <li>Click1 <div> <h2>Menu1</h2> <p>text1</p> </div> </li> <li>Click2 <div> <li>Menu2</li> <li>tex
Dearps
Webサイト&アプリのデザインをもっと効率的に、さらにスピーディーに。 本日Bootcomp4を公開しました。 ダウンロードは「Bootcomp」の特設サイトから。 Webサイトやアプリを制作する際にデザインとコーディングを分業化している会社さんは多いと思います。 その場合よく課題にあがるのがデザイナーとエンジニア間の連携について。 デザインカンプとコーディングされた仕上がりの差を極力なくすためにデザイナー側でマージン、フォント、カラーなどを細かく指定したコーディングガイド(以下ガイド)を作成するのですが、これがけっこう面倒な作業で時間もかかります。 これデザイナーにとって過去のスライス作業並みにモチベーションが下がります↓↓↓ この面倒なガイド作成を猛烈楽にするサービス「Zeplin」を紹介します。 Photoshopからプラグインを使用してZeplinにデザインデータをアップすることに
JPEG画像をより美しく、より軽量に最適化するテクニック
JPEG画像をより美しく、より軽量に最適化するテクニックをSmashingMagazineから紹介します。 Clever JPEG Optimization Techniques 1. 「8ピクセル」のグリッド 2. カラーの最適化 3. JPEG最適化の一般的なTips 1. 「8ピクセル」のグリッド JPEG画像は、あなたが既に知っているように8x8のピクセルのブロックから成り立っています。画質を低くするとよく分かります。 この8x8ピクセルを利用して、JPEG画像を最適化します。 画質10で作成したサンプル 二つの正方形は同じ大きさ（8x8ピクセル）です。左上のはきれいに見え、右下のは汚く見えると思います。 これらは、それぞれ8x8のグリッドに並べたもので、左上はグリッドに揃えたもの、右下はグリッドに揃っていないものです。 保存する際に画像は、8x8ピクセルのブロックに分けられるため
Illustratorで文章を扱うとき（文字組版） - DTP Transit
Illustratorで文章を扱うとき、矩形エリアに文字を流し込んだままではなく、次の4点は、最低限設定します。 行送りの設定 均等配置（行頭行末揃え／ジャスティファイ） 禁則 文字組み（約物前後や和欧間のスペースの設定） 逆を言えば、Illustratorではポイントテキスト（文字ツールでクリックして入力したテキストオブジェクト）を前提としています。 デフォルトの［行送り］は、文字サイズの175％に設定されています。「（14.4pt）」のように（）付きで表示されているときには「自動」行送りになっています。1行あたりの文字数に応じて調整します。 CS以前のIllustratorや、バージョン互換を行ったドキュメントによっては自動行送りが欧文に準じた120%になってしまいます。120%では行送りは狭すぎます。日本語では150-190%程度に設定します。 ［段落］パネルの［均等配置（最終行左揃
[超いまさら]Dreamweaverテンプレートって便利だね - 日々平穏
200804/29[超いまさら]Dreamweaverテンプレートって便利だね CATEGORY:Webネタblog,ツール紹介 TAG:Adobe,Dreamweaver フリーになってからというもの、個人で請け負える範囲でのお仕事をと考えると、どうしても小・中規模サイトの案件が多くなりがち。 それにくわえて、ここ最近の案件でPHPを好きに置いちゃいけないとか、クライアント側で更新したいとか、いろいろと制約のある案件が重なり、そんななかで効率的な制作進行をするためにはどうしたもんかと 思案し「Dreamweaverテンプレート」（以下DWT）を選択したのですが、これがなかなか使える機能だったりしましたので今さらながらに紹介しておこうと思います。 すでにDWTを使用したことがある方には、ホントいまさらなTIPSになるのですが、使ったことのない人のためにざっくり説明しますと、DWTって
CSSの初期化ファイル | d-spica
CSSの初期化ファイル 2008-05-31 0 0 XHTML/CSS CSS 以前， CSSの初期化 というエントリを書きました。あれからいろいろと試行錯誤し，初期化ファイルがずいぶん変わってきましたので，改めて今ぼくが使っている最新のファイルを紹介したいと思います。 default.css 以下からご覧いただけます。 default.css このファイルは次のような目的で作っています。 各ブラウザが持つデフォルトのCSSをリセットして，レンダリングの違いを解消する。 サイトやページによって書き換えることがほとんどない，基本的な設定を行う。 コーディングが分かりやすくなる初期値を指定しておく。 このファイルをあらゆるサイトで使い回せるようにしておくわけです。 リセット /* Reset */ body, div, h1, h2, h3, h4, h5, h6, p, dl, dt, d
Windows7/Vista/XPのリモートデスクトップのセッション数制限を解除する「Universal Termsrv.dll Patch」
Windows XP Professional、Windows Vista BusinessとUltimate、Windows 7 ProfessionalとUltimateで利用可能なのがリモートデスクトップのサーバー機能。画面の描画ベースの転送ではないので細い帯域でも問題なくリモートコントロールが可能であり、出先から自宅のPCを遠隔操作するような場面では大活躍してくれるのですが、「1セッションのみ」という制限があります。つまり、ユーザーAがログインして使っているWindowsに、別のユーザーBがリモートデスクトップで接続してログインしようとすると、現在ログインしているユーザーAは弾き出されて操作できなくなってしまうわけです。 ところがWindows7/Vista/XPの32bit版(x86)と64bit版(x64)の両方に対応するこの「Universal Termsrv.dll Pat
Pure CSSな吹き出し
Twitterで「CSSで吹き出し作るのブクマし忘れててどこにあったか忘れた……」とかつぶやいたらe_luckさんがImage-free CSS Tooltip Pointers - A Use for Polygonal CSS?を探してきてくれた。このエントリでは枠線をつけるために入れ子になっていたりちょっとわかりづらかったので、ものすごく単純化して解説してみようとかなんとか。 Pure CSSな吹き出しのサンプル: Speech Bubbles とりあえず、吹き出しの尻尾を左下に出すもの(サンプル内では4つめのサンプル)を例にして説明していく。HTMLコードは以下のようなもので、bubbleというクラス名を振ったdiv要素がコンテナ、bodyというクラス名を振ったp要素が吹き出しのベース、tailというクラス名を振った空のdiv要素が尻尾になる。 <div class="bubble
Photoshop Tips - 写真加工 - by StudioGraphics
●アンシャープマスクで本当にいいの？ 「いい写真なんだけど、ちょっとだけピントが外れてしまった…残念っ！」 という写真があったとして…いや、筆者の場合もよくあることなんですけど…そんな写真を、あなたならどうしますか？ 諦めますか？ それとも、なんとか救済処置を施してみますか？ 救済処置としては、ご存知だと思いますが、Photoshop のフィルタである［アンシャープマスク］をかけるという方法がありますね。この［アンシャープマスク］とは、画像内の個々のピクセル（画素）の周囲にある、異なる色情報を持ったピクセルを検索し、指定した量だけピクセルのコントラストを高めるフィルタです。つまり、明るいピクセルは指定した量に基づいてさらに明るくなり、暗いピクセルはさらに暗くなり、結果的に画像全体にシャープ効果が得られるというわけです。 でも、RGB 画像に対して普通に［アンシャープマスク］をかけると、実は
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
