ホームページ  >  記事  >  ウェブフロントエンド  >  jquery_jqueryによるアコーディオンピクチャー表示エフェクトの実装方法

jquery_jqueryによるアコーディオンピクチャー表示エフェクトの実装方法

WBOY
WBOYオリジナル
2016-05-16 16:26:201127ブラウズ

この記事の例では、jqueryをベースにしたアコーディオン画像表示エフェクトの実装方法を説明します。皆さんの参考に共有してください。具体的な実装方法は以下の通りです。

コード実行時の効果は次のとおりです:

index.html ページのコードは次のとおりです:

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



<頭>
    jquery に基づいた一項のハンド风琴画像表示効果デモ
   


   

       

           

               

                    Netherlands

           

           

               

                    Belgium

           

           

               

                    France

           

           

               

                    Germany

           

           

               

                    England

           

       

   


<スクリプト>
$('.country').click(function () {
$(this).toggleClass('active');
$('.page-container').toggleClass('opened');
}); //@ sourceURL=pen.js



完全なサンプル コードについては、ここをクリックしてくださいこのサイトからダウンロードしてください

この記事が皆さんの jQuery 特殊効果デザインに役立つことを願っています。

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