jQuery_jquery に基づく最も基本的なフェードインおよびフェードアウト効果の例-jsチュートリアル-php.cn

この記事の例では、jQuery に基づいて最も基本的なフェードインおよびフェードアウト効果を実現する方法を説明します。皆さんの参考に共有してください。具体的な分析は次のとおりです。

jQuery は JavaScript の拡張機能である JavaScript ライブラリであり、さまざまな特殊効果に対する高まるニーズを満たすために使用されます。その本質はJavaScriptです

JQ を説明するために、基本的な JQ プログラムを書いてみましょう。

1. 基本的な目標

Web ページには次の 3 つのボタンがあります。1 つはテキストを非表示にすることのみ、1 つはテキストを表示することのみ、1 つはテキストの非表示と表示を同時に行うことができます。1 回クリックすると表示され、もう一度クリックすると非表示になります。サイクルは無限です。以下に示すように:

2. 製造工程

1. まず、JQ 公式 Web サイトから JQ サポートファイルをダウンロードし、サイトフォルダーに配置する必要があります。このサポートファイルは jQuery1.11 (クリックしてリンクを開きます) にアクセスして、古いブラウザ IE6 と互換性のある jQuery1.11 (クリックしてリンクを開きます) をダウンロードできます (クリックしてリンクを開きます)。古いブラウザIE6と互換性があります。

2. Web ページのコード全体は次のとおりです。説明のために断片に分けています。

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

        <スクリプト>
            $(document).ready(function() {
                $("#hide").click(function() {
                    $("#text").hide();
                });
                $("#show").click(function() {
                    $("#text").show();
                });
                $("#toggle").click(function() {
                    $("#text").toggle();
                });
            });



        JQ淡出与显示

折腾の文本

    <ボタンid="非表示">
        隐藏

（1）部分

部分は主に核心代コード部分であり、後続に放出され、先说部分

复制代码代码如下:

投げられたテキスト

<ボタンid="非表示">
を隠す <ボタンid="表示">
を表示 <ボタンid="切り替え"> 非表示/表示

(2)

コードをコピーします

コードは次のとおりです。

<スクリプト>