CSSでロールオーバーもどき
CSSでロールオーバーもどき ロールオーバーの際に画像の輝度を上げるやり方がありますけど、CSSで簡単にできます。 XHTMLソース <a href="http://blog.webcreativepark.net"><img src="./tor.gif" alt="to-R"/></a> CSSソース a:hover img{ opacity:0.8; filter: alpha(opacity=80); } サンプル ロールオーバー時にimg要素のopacityプロパティを使い不透明度を下げます。 IEはopacityプロパティに対応していない為、filterを使い不透明度を下げます。 簡単なんで、忙しいときに重宝します。 関連エントリー CSSで実現するスマートなロールオーバー 画像置換 cssで画像をプリロードする方法（改 一番簡単な画像置換の方法 画像置換でメニューを作る 画像
MacOS Xの言語モード
Ricoh Caplio GX100 ちょっと大発見。 MacOS Xを英語モードにしたら、今まで日本語モードで使っていたときより断然速い!! MacOS Xの言語モード（というか使用言語の優先順位）は、アップルメニューにある「システム環境設定」の「言語環境」の「言語」で設定できます。 日本語 English …… となっているリストで、「日本語」を持って「English」のひとつ下にDrag&Dropするだけ。そのあと、リストの右にある「単語区切り」を「Japanese」にしておきます。 これで、いったんログアウト（あるいはMacを再起動）して再びログイン（起動）すると、英語モードになります。英語モードといっても単にメニューやアラートなどが英語になるだけ。日本語の表示や入力は全く問題なく今まで通り普通に使えます。 英語モードにすると全てが速い。 アプリの起動が速い。 Safariでページ
Amazonで90％以上OFFのお買い得品を速攻で見つける方法 - GIGAZINE
ネット上の本屋さんだったのが今ではDVD、家電、ソフト、サプリメント、時計などなど、あらゆるものを売っている「Amazon」。今回はそんなAmazonの特価セール品だけをピンポイントで狙い撃ちして見つける方法です。単に検索結果のアドレスを手動でちょこっと書き換えるだけなので誰でもできます。 やり方は以下の通り。 Deals: Search Amazon For Deals Up To 90% Off - Consumerist Amazon shopping tips and hacks at ProBargainHunter.com まずはAmazonのページに行きます お買い得製品を見つけたいジャンルに移動します。今回は例として「エレクトロニクス」を選んでみました。 それから何も入力せずに「GO！」ボタンをクリック するとAmazonのそのジャンルに登録されている製品がずらずらと出てき
Interface.jsで簡単スムーススクロール - Emotional Web
This domain may be for sale!
CSSで実現するスマートなロールオーバー
CSSで実現するスマートなロールオーバー 暇があればコーディングコンテストの作品を眺めているのですが、ほんと勉強になります。 長谷川賞を受信したComplexさんが行っていたロールーオーバーの手法が、JavasScriptも画像置換も使わずにと素敵だったので紹介します。 サンプルはボクの方でアレンジしていますので、オリジナルも合わせて参考にお願いします。 まずサンプルのXHTMLソース <ul> <li class="ajaBtn"><a href="/ajax/"><img src="ajax_a.gif" alt="ajax" /></a></li> <li class="amaBtn"><a href="/amazon/"><img src="amazon_a.gif" alt="amazon" /></a></li> <li class="cssBtn"><a href="/css
ITmedia Biz.ID：Wordのお節介をなくす10の方法
何かとお節介な動きをすることが多いOffice。これらの設定を変更し、直感的に使うためのTipsを紹介する。Word編。 前回のExcelに引き続き、今日はWordの「お節介をなくす10の方法」を紹介する。内容的にはExcelと一部重複するが、設定画面の階層が異なる場合も多いので、同じTipsについても改めて紹介する。Word 2002／2003のほか、Word 2007でも検証した。 Wordの「お節介をなくす10の方法」インデックス アルファベットの1文字目が勝手に大文字になったり、記号に変換されるのを防ぐ 「1.」や「・」が行頭にある文章を改行した際、勝手に箇条書きになるのを防ぐ URLにハイパーリンクが勝手に張られるのを防ぐ 単語の下に波線を引かれるのを防ぐ 勝手にスペルチェックされるのを防ぐ 図を挿入する際に、勝手に描画キャンバスが作られるのを防ぐ あまり使わないメニューが勝手に
RedLine Magazine : ボックス全体をリンクにしたい
ボックス全体をリンクにしたい まずはこちらの発想の元ネタのサイトの紹介。 Link Boxes (Ask the CSS Guy) やりたいことは上記ページの上部の画像のように、見出しやテキストを置いている部分をリンクボックス化したいという主旨。マークアップや正しい書式にこだわらないなら簡単にできるのだが、ちゃんとした事をしたい人向けのTips。 ※以下のソースは上記サイトからの引用です。 上記サイトの言いたい事を簡単な日本語にして主旨だけ書きます。 ※訳とかまとめ要らないという方はその先に「それ、jQueryでやってみる」とか書いてみたので良かったらそちらへ進んでください。 まず中身はこんな感じ。見出しとテキスト。 <h2>About Us</h2> <p>How my life story became a Hallmark movie.</p> これらをボックスにしてリンクを付けたけ
透過pngを表示する-CSS TIPS
透過pngは便利な機能なのですが、IE6が対応していない為、通常のやり方では使用できません。 IE6とその他のモダンブラウザで透過pngを表示する方法は以下のようになります 記述するcssコード div.alpha{ width:100px; height:200px; background:url("alpha.png"); } * html div.alpha{ filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='alpha.png',sizingMethod='scale'); background:none; } サンプル div.alphaの記述はすべてのブラウザに対して適応されます。 その後にスターハックを使用して透過pngをサポートしていないＩＥ６のみに適応するスタイルを記述します。（ＩＥの独自拡張フィ
FireFoxでよく見るWEBページや、Bookmarkletは、keyconfigでショートカット登録しておく：Goodpic
This shop will be powered by Are you the store owner? Log in here
Firefoxのメモリ食いを小食にする (うむらうす)
Firefoxのメモリ大食いグセは、アドオンが充実しているFirefoxにとって、 「これさえなければ・・・」の最たるものだった。 しかし私は昨日、ようやくマトモに効く対処法を発見したのだった。 →メモリ消費 - Mozilla Firefox まとめサイト ・・・なんかすごい普通に本家のまとめサイトなんですが、 なんで今まで試してなかったんだろう。 あたかも昨日突如としてサイトが現れたかのようだ・・・不思議すぎる・・・ すみません探し方が悪かったです m(_*_)m で、以下やり方。 プロファイルフォルダの user.js に以下を記入 // 1.メモリキャッシュの量を指定（単位はKB - 例: 16384/32768/65536など） user_pref("browser.cache.memory.capacity", 16384); // 2.ウィンドウ最小化時にメモリ使用量
100円ノートの「超メモ術」
私はコクヨさんのノートを愛用しています。 一般的に販売されていますので、いつでもどこでも同じものを補充できます。（買いだめ不要）
TRANS - * { magin: 0;}だけでは物足りない！zoom: 1;を使おうよ！
IE6からIE7が今後本格的にマーケットシェアを取って行くことを考えると、IE7の仕様やバグを考えた上でのマークアップが欠かせないとは思います。でも、僕らはまだIE7がどんなものかが分からない。そのため、とりあえず* { zoom: 1;}を指定しておくことが安全策なのかもしれません。 IE7のZoom機能で、見事にこける。 先日、うちの本体のサイトを更新し終わった際に、スタッフから「あれ、しゃらくのサイトずれてるよ」と指摘されました。更新箇所が多く、CSSも多少いじくったので、どこか消してしまったのかもしれません。そこで、自分のブラウザで確認するも、どうも問題が再現できない。そのスタッフのブラウザを見ると、こんな感じになっていました。 僕のFirefoxで見てみても問題ないし、そのスタッフが使っているIE7でも問題なし。「うーん」と悩んでみるものの、意外と答えは簡単なところにありました。
[N] Mac OS X、Finderで隠しファイルを表示する方法
Show hidden files in Finderというエントリーより。 By default, Mac OS X’s Finder keeps system files – which generally start with a dot, like .bash_profile – out of your sight. デフォルトでは表示されない「.」から始まるファイル名を表示するための方法です。 OSXFAQ – Technical News and Support for Mac OS Xが紹介されています。 その方法とはTerminalで以下のようにタイプするだけ。 defaults write com.apple.finder AppleShowAllFiles TRUE 反対に元に戻す時には、 defaults write com.apple.finder AppleSho
![[N] Mac OS X、Finderで隠しファイルを表示する方法](https://cdn-ak-scissors.b.st-hatena.com/image/square/4551a4c386239a8a918ba852f25cb4d77440b9fb/height=288;version=1;width=512/https%3A%2F%2Fnetaful.jp%2Fwp-content%2Fuploads%2F2021%2F03%2Fog-image.png)
ふつうに横三角 - ぼくはまちちゃん！(Hatena)
ＣＳＳで横三角。「半キャラずらし」 (インターネット帳面) 今回はお題の通りインターネット帳面でもやってる「ＣＳＳで横三角をやる方法」。２バイト文字の三角記号は▲や▼しかないので横方向を示すことができませんでした。これをなんとかどーにかできんものかと。 ↑こんな記事があって、ちょっと面白かったので、 参考までに、ふつうの横三角のコードも書いておきますね！ » (») « («) ▷ (▷) ▶ (▶) ◁ (◁) ◀ (◀) そうそう、この中でも » って結構使えるよ！ よくサイドのメニューとかで、CSS を使って <li> の背景左端に、三角っぽい画像を設定したりするよね！ でも » をつかえば、画像がなくてもこんな感じ！ » Diary » Bookmark » Fotolife »
IE7 の隣接セレクタで気が付いたこと
「画像の使用を（略）CSS大会」 に応募した自分の作品を、IE7 で見てみたんですが、なぜか隣接セレクタ （E + F） がまったく適用されていないのに気がつき... 「画像の使用を（略）CSS大会」 に応募した自分の作品を、IE7 で見てみたんですが、なぜか隣接セレクタ （E + F） がまったく適用されていないのに気がつきました。 IE7 は隣接セレクタに対応してるはずなのでおかしいな、なんか自分の書き方がおかしいのかな？なんて思って、手元にある CSS をいじったりしてみたのですがまったく効果なし。何でだろうと思って HTML 文書の方を見て、何気なくソース内のコメントを削除してみたら...... 普通に適用されてる...... orz 該当する HTML ソースは下記の通り。 <div id="navigation"> <h2>Contents</h2> ...中略... </di
web-conte.com | blue | Lightbox JS v2.0 と Flash
web-conte.comでも画像の拡大表示時に使っている「Lightbox JS v2.0」。これ、ページ内にFlashが同居していると厄介なのである。自分のサイト（ここ）だとそもそもFlashを置いていないから気づきにくい問題なのだが、先日あるサイトを作っていてこのことに気づいた。Flashオブジェクトは z-indexなどの指定を無視し、基本的にドキュメントの最前面にあるように表示されてしまうため、Flashだけは背景に追いやられず、Lightboxで拡大表示させた画像のさらに手前に出てきてしまう。 このことの解決策はひとまずあって、たとえば「小粋空間: Lightbox JS でブログパーツ等の Flash を PNG 背景画像の下に隠す」などの解説が丁寧だ。要は、Flashを埋め込む際の記述のひとつに「背景を透過する」という命令にあたるものがあって、それを書き加えてやればいい。
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
https://netmania.jp/colum/homepage/000495.php
POSEMANIACS - Royalty free 3d pose reference for all artists
世界の名画でデジカメ画像を一発補正
http://arena.nikkeibp.co.jp/tec/camera/20020902/101713/