jQuery_jquery に基づく最も基本的なフェードインおよびフェードアウト効果の例

この記事の例では、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(); 
                }); 
            }); 
         
         
 
 
         
         
     
     
        
   

 
        折腾の文本
   

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

（1）部分

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

复制代码代码如下:

投げられたテキスト

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




(2)




コードをコピーします

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

<スクリプト>