2017-05-18 19 views
0

私は、Displayタグライブラリを使用してソートされたヘッダーを持つテーブルを持っています。クリック時の背景画像の変更

ヘッダーをクリックすると、他のヘッダーから背景イメージを削除し、「上向き矢印」イメージを表示します。同じヘッダーをもう一度クリックすると、「下向き矢印」画像が表示されます。

これは私が今使っているCSSです。

CSS

th { 
    height: 25px; 
    border: 1px solid #EAEAEA; 
} 

th.sortable a:ACTIVE { 
    background: url("../images/integration/downArrow.gif") no-repeat 30%; 
} 

th.order1 { 
    background: url("../images/integration/upArrow.gif") no-repeat 30%; 
} 
+1

ここでもう少し詳しい説明をしてください。あなたが含まれているコード - それは動作しますか?なぜあなたの目標を達成していないのですか? 「私はこれがほしい、これはそういうことをすべきだ」と言っているのではなく、*あなたにお手伝いできるように質問してください! – Santi

+0

コードとしてのデモを教えてください。 JSfiddle、CodePen、またはスニペット?私はあなたに理論上の解決策を与えることができますが、実際の解決策を提供するコードが必要です。 –

+0

みんな、簡単にどうぞ。私は私の並べ替えの世話をしているディスプレイタグライブラリを使用しており、また、画像もそこにあります。しかし、私が達成しようとしているのは、最初にヘッダーの上にのみイメージを表示することです。表示タグを使用しているため、コードは取得されません。 – Mike

答えて

0

私は解決策を持って、私はまだ質問を理解しようとしている者として非常に残念です。私のソリューションを実行し、あなたは答えにも質問を得るだけではありません。私はCSSでorder1とorder2を設定する必要がありました。

th.order1 { 
background: url("../images/integration/upArrow.gif") no-repeat 30%; 
} 

th.order2 { 
background: url("../images/integration/downArrow.gif") no-repeat 30%; 
} 
関連する問題