0

私のウェブサイトで目的の :active div id をクリックできる純粋な css メソッドは本当に存在しませんか? 私がこれまでに見つけたものはすべて、CSS で行われた悪い方法か、JQuery または Javascript で行われた方法ですか? 誰でも、誰でも PURE CSS が必要です。ありがとう！

4

6 に答える 6

1

CSS div には onclick ハンドラがありません。div を a 内に配置する必要があります。

'<あ>'

タグ..リンクのように処理できます..そして、マウスホバーなどの機能を備えています..このスレッドを見てください

于 2013-01-15T15:06:50.410 に答える
0

試すことができます、:active疑似クラス。ただし、その場合でも、表示したいものはすべてその中にラップする必要があります。とにかく、私の試みは：

<a>
  Click and Hold Me!
  <div class="expand">
    I am the expander!
  </div>
</a>

CSS

a {text-decoration: none;}
a .expand {height: 0; overflow: hidden; transition: height 5s;}
a:active .expand {height: 1em; overflow: visible; transition: height 5s;}

フィドル: http://codepen.io/praveenscience/pen/KArEB

于 2013-03-14T02:32:39.527 に答える
0

これは、表示と非表示を切り替える純粋な CSSメソッドです。「タイトル」コンテンツをコンテナ要素に配置します。'info' コンテンツを 'title' の下に配置しますが、同じコンテナー内に配置します。次に、クリック アクティビティに応答するように動作をスタイルします。

.dropdowntitle, article > * { cursor: pointer; }
.dropdowntitle:focus + .dropdowninfo { display:block; }
.dropdowninfo { background-color:inherit; display:none; height:inherit; }

<article>
<h3 class="dropdowntitle" tabindex="1">Title</h3>
<p class="dropdowninfo">Info</p>
<h3 class="dropdowntitle" tabindex="2">Title</h3>
<p class="dropdowninfo">Info</p>
<h3 class="dropdowntitle" tabindex="3">Title</h3>
<p class="dropdowninfo">Info</p>
</article>

一度に 1 つの情報ドロップダウンだけにユーザーを集中させます。長い「リスト」での単純なドロップダウン ダブルクリックの閉じて開くナビゲーション。閲覧履歴に干渉しません。

短所基本的な HTML/CSS が可能な限り (ツールチップの data-title 属性で title 属性を置き換えます: HTML データ レイヤーをクリック/タップしてドロップダウン タイトルをオーバーレイします)? JQuery、そしてプログラマティックスがこれを確実に乗り越えます。

http://tympanus.net/codrops/2012/12/17/css-click-events ) チェックボックスとターゲットのハックを試しましたが、改善されませんでした。

CSS類似のスレッドでクリック時に div を表示/非表示にします。

HTML/CSS は複数の要素を表示/非表示にしますか? 主にスクリプト ソリューション

https://support.office.com/en-us/article/Create-or-edit-a-hyperlink-5d8c0804-f998-4143-86b1-1199735e07bf複数のドロップダウンを同時に個別にプログラムで表示/非表示にします。

于 2016-11-19T05:54:03.157 に答える
0

特定の html 要素に CSS を指定すると、マウス イベントを受け取る要素のスタイルに影響を与える機能が制限されます。特定の要素をクリックしたときに別の要素を表示するには、マウス イベントのターゲットではない別の html 要素のスタイルを変更する必要があります。そのため、必要なことを行うには、javascript、または vb などの独自の Web スクリプト言語が必要です。行う。

これについて最後にお伝えすることは、CSS は個々の要素または要素のグループにスタイル効果を追加することを目的としているということです。ウェブサイトに重いプログラム機能を実装することを意図したものではありません。それがJavaScriptが発明された理由です。

于 2013-01-15T15:07:42.557 に答える
0

あなたが試すことができます:target

または、 child A B、 nextA+Bまたは siblingA~Bセレクターを使用します。

しかし、純粋なcssメソッドは、クラスを追加/削除するだけの単純なjsほど広くブロックの状態を保存および操作できません。

于 2013-01-15T15:05:31.787 に答える