ホームページ ウェブフロントエンド jsチュートリアル JQuery 入門 - イベント Switching_jquery 用の hover() メソッドのアプリケーションの紹介

JQuery 入門 - イベント Switching_jquery 用の hover() メソッドのアプリケーションの紹介

May 16, 2016 pm 05:42 PM
hover

1. JQuery では、イベントの切り替えには hover() と toggle() の 2 つのメソッドがあります。いわゆるスイッチング イベントとは、要素の動作を切り替えるために 2 つ以上のイベントが要素にバインドされていることを意味します。たとえば、ハイパーリンク タグ で、マウスがホバーしているときにイベントをトリガーし、マウスが移動したときに別のイベントをトリガーする必要がある場合、switch イベントを使用することで簡単に実現できます。

2. サンプルコード :

コードをコピーします コードは次のとおりです:

;



スイッチイベントホバー




JQuery の概要

JQuery は、2006 年にアメリカ人の John Resig によって作成されたオープンソース プロジェクトです。その主な目的は、より少ないコードでより多くの機能を実現することです




3. レンダリング プレビュー
:

マウスが JQuery の概要に移動すると:

このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。

ホットAIツール

Undresser.AI Undress

Undresser.AI Undress

リアルなヌード写真を作成する AI 搭載アプリ

AI Clothes Remover

AI Clothes Remover

写真から衣服を削除するオンライン AI ツール。

Undress AI Tool

Undress AI Tool

脱衣画像を無料で

Clothoff.io

Clothoff.io

AI衣類リムーバー

AI Hentai Generator

AI Hentai Generator

AIヘンタイを無料で生成します。

ホットツール

メモ帳++7.3.1

メモ帳++7.3.1

使いやすく無料のコードエディター

SublimeText3 中国語版

SublimeText3 中国語版

中国語版、とても使いやすい

ゼンドスタジオ 13.0.1

ゼンドスタジオ 13.0.1

強力な PHP 統合開発環境

ドリームウィーバー CS6

ドリームウィーバー CS6

ビジュアル Web 開発ツール

SublimeText3 Mac版

SublimeText3 Mac版

神レベルのコード編集ソフト(SublimeText3)

CSS ヒント: トランジションを使用してホバー状態を保持する CSS ヒント: トランジションを使用してホバー状態を保持する Sep 27, 2022 pm 02:01 PM

ホバー状態を保存するにはどうすればよいですか?以下の記事ではJavaScriptを使わずにホバー状態を保持する方法を紹介していますので、ご参考になれば幸いです。

CSSでホバーイベントを削除する方法 CSSでホバーイベントを削除する方法 Feb 01, 2023 am 10:06 AM

CSS ホバー イベントを削除する方法: 1. "$("a").hover(function(){alert('mouseover'); }, function(){ 「alert('mouseout'); })」メソッドを使用してホバー イベントをバインドします。 2. 「$('a').off('mouseenter').unbind('mouseleave');」メソッドを使用してホバー イベントのバインドを解除します。できる。

体験は飛んでいます。Haval X1 カメラで飛行してみませんか 体験は飛んでいます。Haval X1 カメラで飛行してみませんか Jan 15, 2024 pm 02:21 PM

インターネット上では素晴らしいトップダウン動画がたくさん見られますが、ドローンで撮影された映像は確かに衝撃的ですが、実際にはドローンについての理解が浅い人が多いのが現状です。飛行が制限されている場所はどこですか?実際、すぐに飛行できる「ドローン」が現在の主流であり、多くの人が選択する価値のあるドローンです。今日は Harvest Flying Camera X1 を実際に体験していただきます。外観では、Harvest Flying Camera X1は初の折りたたみデザインを採用しており、カメラ全体の重さはわずか125gで、携帯電話よりも軽く、折りたたんだ後は手に持ってカバンに入れても圧迫感がありません。 。 4つの柔らかい染め葉と安全フレームの設計が撮影の安全を完全に保護します。 Dyed Leaf は、弾性が高く、耐久性があり、安全で環境に優しいバイオベースの生物学的基材を革新的に使用しており、離陸時と着陸時に手を保護する完全保護フレームも備えています。

CSSでホバーを使う方法 CSSでホバーを使う方法 Feb 23, 2024 pm 12:06 PM

CSS の hover 疑似クラスは、マウスが要素上にあるときに要素のスタイルを変更できるようにする非常に一般的に使用されるセレクターです。この記事では、ホバーの使い方を紹介し、具体的なコード例を示します。 1. 基本的な使用法 hover を使用するには、まず要素のスタイルを定義し、次に :hover 疑似クラスを使用して、マウスがホバーしているときに対応するスタイルを指定する必要があります。たとえば、ボタン要素があるとすると、ボタンの上にマウスを置くと、ボタンの背景色が赤に、テキストの色が白に変わります。

なぜホバーは擬似要素なのでしょうか? なぜホバーは擬似要素なのでしょうか? Oct 09, 2023 pm 05:45 PM

Hover は擬似要素ではなく、擬似クラスです。疑似クラスは要素の特定の状態や動作を選択するために使用され、疑似要素は要素の特定の部分にスタイルを追加するために使用されます。 :hover は、要素の特定の部分にスタイルを追加するのではなく、要素の特定の状態を選択するために使用されるため、:hover 疑似クラスを使用して要素のマウスオーバー状態のスタイルを設定することができます。また、:hover を使用することもできます。リンクにホバー効果を追加する疑似クラス。リンク上にマウスを置くと、リンクの色、背景色などが変化します。

HTMLにおけるホバーの役割 HTMLにおけるホバーの役割 Feb 20, 2024 am 08:58 AM

HTML におけるホバーの役割と具体的なコード例 Web 開発では、ホバーとは、ユーザーが要素の上にカーソルを置いたときにいくつかのアクションや効果をトリガーすることを指します。これは、CSS :hover 疑似クラスを通じて実装されます。この記事ではホバーの役割と具体的なコード例を紹介します。まず、hover を使用すると、ユーザーが要素上にマウスを移動したときに要素のスタイルを変更できます。たとえば、ボタンの上にマウスを置くと、ボタンの背景色やテキストの色を変更して、次に何をすべきかをユーザーに思い出させることができます。

jQueryのhover()メソッドの使い方 jQueryのhover()メソッドの使い方 Dec 04, 2023 am 09:56 AM

hover() は jQuery で一般的に使用されるメソッドです。2 つのイベント処理関数をバインドするために使用されます。これら 2 つの関数は、マウス ポインタが一致する要素に出入りするときに実行されます。基本的な使い方は「$(selector).hover(inFunction,outFunction);」です。

CSSでホバーを使う方法 CSSでホバーを使う方法 Nov 24, 2023 am 10:32 AM

CSS では、:hover は、マウス ポインターが上にある要素を選択するために使用される疑似セレクターです。 :hover を使用すると、ユーザーが要素の上にマウスを移動したときにスタイルの変更を適用できます。

See all articles