ホームページ

JS特殊効果

jQueryの効果

jQueryクリック水波アニメーション垂直ナビゲーションバーコード

ダウンロード中プレビュー

js 代

<script type="text/javascript" src="js/jquery.min.js"></script>
<スクリプトタイプ="text/javascript">
//jQuery時間
var 親、インク、d、x、y;
$(".nav ul li a").click(function(e){
親 = $(this).parent();
// .ink 要素が存在しない場合は作成します
if(parent.find(".ink").length == 0)
parent.prepend("<span class='ink'></span>");

ink = 親.find(".ink");
//素早いダブルクリックの場合、前のアニメーションを停止します
ink.removeClass("アニメーション");

//.inkのサイズを設定
if(!ink.height() && !ink.width())
{
//親の幅または高さのどちらか大きい方の直径を使用して、要素全体をカバーできる円を作成します。
d = Math.max(parent.outerWidth(),parent.outerHeight());
ink.css({高さ: d, 幅: d});
}

//クリック座標を取得する
//ロジック = ページを基準とした座標をクリックします - ページを基準とした親の位置 - 中心から制御できるようにするため、自身の高さ/幅の半分;
x = e.pageX -parent.offset().left -ink.width()/2;
y = e.pageY -parent.offset().top -ink.height()/2;

//位置を設定し、クラス .animate を追加します
ink.css({上: y+'px', 左: x+'px'}).addClass("アニメーション");
})
</script>

一項を明確に示した jQuery + CSS3 をベースにして実現された、ウォーターウェーブアニメーションエフェクトの直進ナビゲーションコード、マウスポイントのナビゲーションメニュー単体で表示されるウォーターウェーブアニメーションスペシャル。

免責事項

このサイトのすべてのリソースはネチズンによって提供されたもの、または主要なダウンロードサイトによって転載されたものです。ソフトウェアの整合性をご自身で確認してください。このサイトのすべてのリソースは学習の参考のみを目的としています。商業目的で使用しないでください。そうでない場合は、すべての結果に対して責任を負うことになります。侵害がある場合は、削除するためにご連絡ください。連絡先情報: admin@php.cn

ソースコード download_jquery を使用した jQuery に基づくマウスクリックナビゲーションメニューの水の波のアニメーション効果の実装

16 May 2016

この記事では主に、jQuery に基づいたマウスクリックナビゲーションメニューの水の波のアニメーション効果の実装を紹介します。ソースコードのダウンロードが添付されていますので、必要な方は参照してください。

jqueryのハート型のいいね効果とフォロー効果の簡単な実装

07 Dec 2016

jqueryのハート型のいいね効果とフォロー効果の簡単な実装

jqueryアニメーションエフェクト学習メモ(8つのエフェクト)_jquery

16 May 2016

この記事では、jquery アニメーション効果の詳細な分析を提供する jquery アニメーション効果の学習ノートを共有し、フェードインおよびフェードアウト効果とスライディング効果の原理を説明します。jquery アニメーション効果をよく学びたい場合は、次のリンクを参照してください。この記事を辛抱強く読んでいただければ、予想外のことが見つかると思います。

HTML5の超リアルな雪景色エフェクト

18 Jan 2017

jqueryをベースにした超リアルな雪景色の特殊効果です。この特殊効果は、jquery コードを使用して html5 キャンバス要素を動的にプラグインし、キャンバス内に雪の特殊効果を作成します。

jQueryはAlipayホームページのフォーカス画像効果を模倣します

25 Apr 2018

今回は、jQueryのAlipayホームページのフォーカス画像効果をお届けします。jQueryのAlipayホームページのフォーカス画像効果の注意点は次のとおりです。見てみましょう。

JQuery UI CSS Framework_jquery

16 May 2016

Jquery ui css フレームワークは、jquery ui のスタイルフレームワークです。jquery テーマローラーを使用して、必要な CSS スタイル効果を生成できます。 jquery ui のいくつかのフレームワークを使用して、jquery ui css フレームワーク効果に基づいたプラグインを開発できます。