2009-06-02 9 views
1

は、クロムまたはFirefoxは、このページで使用される場合(左側にその33%は黒で、右へ67%は白です):文字の色を部分的に逆にする方法は?

a page on dell.com

(またはほとんどすべての製品ページが動作するはずです)。 4つのタブがあり、「レビュー」の最後のタブをクリックすると、ステータスバーの文字の一部が反転します。例えば、文字「v」は、左側66%が白、右側33%が黒であることができる。マウスの右クリックではFlashプラグインメニューが表示されないので、Flashで行なわれていないことは確かです。誰かがそれをやる方法を知っていますか?

スクリーンショット:

alt text http://img192.imageshack.us/img192/2696/partlyreversed.png

+1

。男の子、アニメのすごいやり方はなんで? – Tomalak

+0

@TomalakあなたはWindowsウィジェットのように動作させる方法をちょっと分かりやすくしていると思いませんか? –

+0

@ Jian Lin:正直言って、Webページ上のWindows 95スタイルのプログレスバーの動作を模倣するのは難しいでしょう。 :) – Tomalak

答えて

8

私は言葉は一度各色で、二回実際にそこにあるが、白バージョンはプログレスバーでクリップさを想像してみてください。

+0

左のdivを使用して、白いテキストの部分を「表示」しますか?それは賢明です。 –

+0

+1このスマートハックのため。これはおそらくこのように行われます。偉大なアイデア男! –

2

サンプル:あなたが言及Dellのページは* *それをしないかのかなり良い例であることを

<div style="width:400px; height:1.1em; position:relative;"> 
    <div style="position:absolute; text-align:center; width:400px; height:100%; background-color:#eee;">49 %</div> 
    <div style="position:absolute; overflow:hidden; width:195px; height:100%; background-color:#347;"> 
     <div style="width:400px; text-align: center; color: #ace;">49 %</div> 
    </div> 
</div> 
関連する問題