アカウント名:
パスワード:
CSS の表現能力が足りないのではなく、ブラウザの CSS 実装レベルが足りないって方が現実に合っているかと思いますが。 画像を使うと CSS じゃ無理、なんてのはかなり意味不明です。
アンカーが画像だったらどうする? 単純にimgタグを使う場合cssでは違う画像に変更するなんてできないよね
a 要素の内容に img 要素しか置かないならこれでできますけど。
a[href]:hover > img { display: none; } a[href="http://www.example.com/"]:hover:before { content: url(http://www.example.com/images/top.png); }a[href="http://www.example.com/content1/"]:hover:before { content: url(http://www.example.com/images/content1.png); }a[href="http://www.example.com/content2/"]:hover:before { content: url(http://www.example.com/images/content2.png);
a[href]:hover > img { display: none; } a[href="http://www.example.com/"]:hover:before { content: url(http://www.example.com/images/top.png); } a[href="http://www.example.com/content1/"]:hover:before { content: url(http://www.example.com/images/content1.png); } a[href="http://www.example.com/content2/"]:hover:before { content: url(http://www.example.com/images/content2.png); }
この列挙が面倒じゃないって本気で言ってる? 凄まじく面倒です a:hover:before > img.chimg[src="(.*).(.*)"] { content: url($1_o.$2
本気で言ってますよ。それでもサイト全体の全文書に JavaScript を埋め込むよりマシですから。CSS は on だけど JavaScript が off だと全く機能しないようなものよりはマシだし、ある程度量が増えたら make 一発生成とかして終わりになるだけでしょうから。
それと、正規表現的にあまりにもありえなさすぎる例示なのでエスパー解釈してみようと思いましたが、CSS でひたすら列挙する方がコスト的に少ない点と漏れが出る可能性が低い点、確認コストが少ない点などから確実にマシですね。HTML 側はサイト共通スタイルシートの指定以外何も文書をいじる必要がないのですから。
それと、img 要素の src にそんな単純な範囲で指定できるなら、そもそも class 指定すら不要に思えますね。
1つのリンクに対して約100byteとすると リンクが10000あったらそれだけで1Mbyte そんなサイズのcssは今のところ現実的ではないですね
そりゃあり得ないですよね。1 サイトで 10,000 も個別にリンク用画像を置き換える必要があるサイトとか。(笑) そのために JavaScript を埋め込む製作者のコストと、個別のページの各リンクに埋め込むコストについてはどうですか? 単純にサイズ面でも ' onmouseover="a();"' (最短パターン) で 19 文字が増加する訳ですが、1 HTML 文書内に重複なしで 10,000 個のリンクがあったら、HTML ファイルが 10 個あるだけで 1,9
より多くのコメントがこの議論にあるかもしれませんが、JavaScriptが有効ではない環境を使用している場合、クラシックなコメントシステム(D1)に設定を変更する必要があります。
UNIXはただ死んだだけでなく、本当にひどい臭いを放ち始めている -- あるソフトウェアエンジニア
NoScript (スコア:1)
NoScriptのデフォルト設定はフツーに閲覧するには少々厳しすぎない?
私はNoScriptを入れてるけど、いつもは無効にしてる。
JSとCSSの住み分けが進む (スコア:5, 興味深い)
Javascriptを視覚エフェクトとしてつかっているサイトは非常に多いと思いますが、Scriptなしでも最低限の機能は提供するのがうまい設計であって、切るだけでボロ崩れ/飛べない場所が出る等の機能不全を起こすのはダメダメといえます。
CSS2.1(の主にセレクタ)をフルに使えるブラウザに最適化されたサイトは、この部分にさえ、Javascriptを多用する必要はありませんよね。
これから視覚エフェクトはCSS一本に、Javascriptはそれ以外にと住み分けが進んでいくと思います。
# Noscriptはホワイトリストで使ってますが、まともに見れなくなるダメサイト結構多い。
Re: (スコア:1)
画像使わないなんて事は上が許してくれないわけで・・・
そうなるとcssじゃ全然足らないよ・・・
Re: (スコア:1)
CSS の表現能力が足りないのではなく、ブラウザの CSS 実装レベルが足りないって方が現実に合っているかと思いますが。
画像を使うと CSS じゃ無理、なんてのはかなり意味不明です。
Re: (スコア:1)
アンカーがテキストだったらcssで「全部共通で」色を変更したり指定できる
アンカーが画像だったらどうする?
単純にimgタグを使う場合cssでは違う画像に変更するなんてできないよね
background-imageで指定してそれを切り替えるという手段もあるけど
その場合すべての画像を使ったアンカーに対してcssを書かないといけなくてとても面倒だしサイズが大きくなるよね
だからjs使ってmouseoverで画像切り替えるような処理にするのは当然の方向性だよね
Re: (スコア:1)
a 要素の内容に img 要素しか置かないならこれでできますけど。
Re: (スコア:1)
この列挙が面倒じゃないって本気で言ってる?
凄まじく面倒です
a:hover:before > img.chimg[src="(.*).(.*)"] { content: url($1_o.$2
Re: (スコア:1)
本気で言ってますよ。それでもサイト全体の全文書に JavaScript を埋め込むよりマシですから。CSS は on だけど JavaScript が off だと全く機能しないようなものよりはマシだし、ある程度量が増えたら make 一発生成とかして終わりになるだけでしょうから。
それと、正規表現的にあまりにもありえなさすぎる例示なのでエスパー解釈してみようと思いましたが、CSS でひたすら列挙する方がコスト的に少ない点と漏れが出る可能性が低い点、確認コストが少ない点などから確実にマシですね。HTML 側はサイト共通スタイルシートの指定以外何も文書をいじる必要がないのですから。
それと、img 要素の src にそんな単純な範囲で指定できるなら、そもそも class 指定すら不要に思えますね。
Re: (スコア:1)
まずサイズ
1行目の
a[href="http://www.example.com/"]:hover:before { content: url(http://www.example.com/images/top.png); }
が104文字
1つのリンクに対して約100byteとすると
リンクが10000あったらそれだけで1Mbyte
そんなサイズのcssは今のところ現実的ではないですね
列挙するコスト
静的ページならパースかければとりあえず漏れなく列挙できるでしょうね
でも動的ページならどうしますか?
「一発生成」できるようにするまでのコストがとんでもなくでかいと思いますよ
切り替えする画像としない画像の判定はどうしますか?
Re: (スコア:1)
そりゃあり得ないですよね。1 サイトで 10,000 も個別にリンク用画像を置き換える必要があるサイトとか。(笑)
そのために JavaScript を埋め込む製作者のコストと、個別のページの各リンクに埋め込むコストについてはどうですか? 単純にサイズ面でも ' onmouseover="a();"' (最短パターン) で 19 文字が増加する訳ですが、1 HTML 文書内に重複なしで 10,000 個のリンクがあったら、HTML ファイルが 10 個あるだけで 1,9
Re:JSとCSSの住み分けが進む (スコア:1)
>画像を使うと CSS じゃ無理、なんてのはかなり意味不明です。
それぞれ個別に記述をしないといけないという段階でcssの表現能力が全然足りてない
a:hover で「一括で」フォーカスされたアンカーの見た目を変えれることは素晴らしい
img:hoverで同様に「一括で」画像を切り替える記述はできないよね
そもそも「画像を切り替える」ってことがcss的ではないといえるんだけど
img[src="http://example.com/img/link_button.png"]:hover { content: url(http://example.com/img/link_button_o.png) }
みたいな書き方ができればいいのかな
これなら列挙しても我慢できるレベル
正規表現が使えてまとめられるならなおよし
a[href="http://www.example.com/"]:hover:before { content: url(http://www.example.com/images/top.png); }
この記述は出来の悪いスクリプト言語にしか思えない
本来意図されているbefore,afterの使い方とは違うとおもう
これをだらだら列挙するのは精神的によろしくない