2011-03-02 14 views
1

スタッカー、以前にJQueryUI Tabsプラグインを使用して作成したタブの周囲に影をつける必要があります。影はタブの右上になければなりません。影付きのタブ

moz-box-shadowなどを使用すると素晴らしいかもしれませんが、私のアプリケーションもIEで表示する必要があります。

私のjQueryのコード(非常にシンプル):

$("#tabs").tabs(); 

これは、それがどのように見えるかです: Tabs

誰もがこれを行う方法を知っていますか?ありがとう!

+0

これらのタブにクラスを追加できますか? – Kyle

+0

@Kyle確かに、私たちが必要ならば追加することができます。 –

答えて

2

は6+ Internet Explorerで作業を行う:http://css3pie.com/(デモが利用可能)

PIEシャドウは、IEシャドウ/ドロップシャドウフィルタよりも見た目がよく見えます。

+0

これは私が必要なものです。ありがとうウィレム。 –

1

あなたは本当のブラウザとIE用のフィルタのためのこの使用CSS3を行うことができます。

は、あなたのタブtab-shadowにクラスを追加し、このCSSを使用します。

.tab-shadow 
{ 
    box-shadow:2px -2px 6px #333333; /*standard CSS3*/ 
    -moz-box-shadow:2px -2px 6px #333333; /*firefox*/ 
    -webkit-box-shadow:2px -2px 6px #333333; /*webkit (safari, chrome*/ 
    filter: progid:DXImageTransform.Microsoft.Shadow(Strength=2, Direction=310, Color=’#000000′); /*ie*/ 
    height: 100px; 
    width: 200px; 
    border: 1px dashed #f00; 
    background: #fff; 
} 

ない、それはIEのみで動作すること(個人的な経験から)の境界線を設定して

This should be what you're after :) PIE.htc CSS3の影で

+0

ソリューションはうまくいきます。私はこの答えを投票するが、@ウィレムの答えはもっと必要なものだ。本当にあなたの助けに感謝カイル。良い仕事:) –