WorldWideScripts.net Delivering the best Add-Ons in more than 37 languages.

中文(简体), English, हिन्दी/हिंदी, Español/Castellano, العربية, Русский язык, Français, 中文 (台灣), বাংলা, Bahasa Indonesia, اردو, Português, Deutsch, Bahasa Melayu (بهاس ملايو‎), 日本語 (にほんご), فارسی, Italiano, తెలుగు, Türkçe, ગુજરાતી, Język polski/polszczyzna, Tiếng Việt, ಕನ್ನಡ, Українська мова, ไทย
JavaScript / Sliders

pageAnimate Web-Page Slider

— アドオンWorldWideScripts.netへ

@ja1wws日付まで滞在するために私達のフィードを購読する!

新しい!あなたがそれを望むように私たちに従ってください!


pageAnimate Web-Page Slider - CodeCanyon Item for Sale

Ads

Ad: Bluehost hosting



このjQueryプラグインは、Webページ間を移動するための全ページスライダーです。 たとえば、というように、別の上の1つのスライド、コンタクトページにあなたのホームページを持っているし、可能性があります。 これは、反応して、(インターネットエクスプローラー6を含む、すべての主要ブラウザで動作 :O )と携帯電話のブラウザ。

名前が示すように、スライド(他のjQueryのコンテンツ、ビデオ、何-ない)の内側に何かを置くことができ、各スライドはただの通常のページのようにオーバーフローを表示するにはスクロールします。 そこで私はスライダーが解除されますことを知っているものは何もありません、あなたは、スライド無限の量を追加することができます。 これは、あなたのウェブサイトにスパイスを効かする必要が正確に何であります!

これは完全なウィンドウの内容のために設計されていますが、あなたは同じように簡単に伝統的なjQueryのコンテンツスライダーとしてこれを使用することができます。実際には、それがInternet Explorer 6で美しく動作しますので、pageAnimateは、おそらく他のスライダーよりも優れています!

注意:あなたは携帯電話のブラウザでCodeCanyonプレビューを表示する場合、CodeCanyonのレンダリングはまったく動作しません。 あなたが訪問する必要がhttp://creativewebsites.me/pageAnimate/previewをアクションでそれを見るために。

バージョン1.1アップデート

継続的にすべてのスライドを介しているので、スライダーを自動的に(ハッシュを使用した)各スライドに固有のURLを与える能力と自動進める機能サイクル:バージョン1.1には、2つの新しい機能が付属しています。 どちらも、(私はとにかくそれを望む誰でも考えることはできません)を同時に有効にすることはできません。

以前のバージョンがインストールされていて、あなたがこのバージョンに更新する場合は、.pageAnimateのクラスを持っているdiv要素に「データ・スライド= "0"」属性をハードコーディングすることを確認してください。 ようにします:

 <divクラス= "pageAnimate"データスライド= "0"> </ DIV> 

.pageAnimate_triggerを:また、あなたは、トリガーすべてのスライドに次のクラスを追加する必要があります

何JavaScriptが無効になっている場合は?

このプラグインは、主にはJavaScript上で動作します - しかし、JavaScriptが無効になっていたらどう? スライダは無用です(それは人々が、あなたのホームページを見ることができますを意味します!)。 いいえ、もちろんありません。 あなたはスライドに行くのトリガーへのフォールバック「HREF」のリンクを追加することができます。 JavaScriptが無効になっているときに、このトリガーはpageAnimateでスライドに行くことはありませんが、ちょうど(あなたが「HREF」に定義されている)他のページへの通常の方法で進行します。

pageAnimateスライダーは、他のWebページからのコンテンツ引っ張っていますか?

いいえ、プラグイン自体は、他のWebページからコンテンツをプルしません。 あなたは、AjaxまたはPHPコードのわずか数行で、スクリプト自体がその機能を持っていないと、各スライドの/ページのコンテンツを手動で追加する必要があることを行うことができますが。 Ajaxを使って、あなたのウェブサーバからコンテンツをプルするには、ちょうどこのコードを使用します。
 ます。<script type = "text / javascriptの"> $( "#slide_id_or_class」).LOAD(「http://www.yourserver.com/yourpage.html"); </スクリプト> 
(ちょうどあなたがに追加するpageAnimateスライドのCSSのIDまたはクラスに 「#slide_id_or_classを変更

それでは、どのよう私はスライダーがスライドに移動するのですか?

それは簡単なことではありません - ちょうどこのコードを追加します。
 <a class="pageAnimate_trigger pageAnimate_trigger1">このテキストは2 </a>にスライドに移動します 
クラス名の末尾に追加された番号に注意してください? その小さな数は、スライドがアニメーションにされるかを定義します。 しかし、(ここで私と一緒にクマ)JavaScriptですべてがゼロベースであるため、我々は、スライド番号をオフにする必要がありマイナス1。 「pageAnimate_trigger 3」:私たちが望むのであれば、たとえば、スライダー、テキストがクリックされたとき、私たちはこのクラスを追加します。#4をスライドに移動します。 我々は#6をスライドするスライダーに行きたい場合は、このクラスを追加します。 "pageAnimate_trigger 5」。 前述したように、あなたは、JavaScriptが無効になっている場合にのみ従うことができるアンカータグ、へのリンクを追加することができます。 だから、訪問者はまだ彼らはJavaScriptを無効にしている場合は、サイト上の他の場所にクローン化されたページを表示することができますことを意味します。

私は手動ですべてのスライドへのリンクを追加する必要がありますか?

すべてではない - スクリプトは、あなたのためのすべての作業を行います。

どのように私は、通常のコンテンツスライダーではなく、ウェブページスライダーにこれを作るのですか?

簡単に - あなたが行うすべては、jQueryのスクリプトの「設定」内の単一の行を変更しています。 あなたはpageAnimateスライダーのコンテナとしてのdiv(または他の類似のタグ)を持っている必要があります。 単にスクリプトでそのdiv要素を定義します。

何か問題やバグはありますか?

  1. ブラウザウィンドウが中またはIE 8でズームアウトすると、スライドが自動的に全画面表示になるようにサイズ変更されません。 私は解決策を見つけるために年齢のためにしようとしたが、できませんしました。 しかし、彼らは実際のウィンドウが小さいまたは大きいドラッグされたときにサイズを変更してください。 これはIE8上でズームインやズームアウトあまりにも多くの人々が存在しないので、これは大したことではないはずです、IE 8に固有のものです。
  2. jQueryの1.8.1を使用している場合、Firefoxは多くのトリガーが立て続けにクリックされたときにフリーズします。 jQueryの1.7.2で正常に動作します。
  3. スライダーのナビゲーションは完全にあなたがスマートフォン上で拡大すると分解します。 これは、HTMLドキュメントの<head>セクションにこのコードを追加することによって固定することができます。
     <メタ名=内容= "ビューポート" "幅=装置の幅を、最初のスケール= 1;最大規模= 1"> 
  4. スライダーのアニメーションは、古いスマートフォンで少しびくびくかもしれない - それはあまりにも悪くはないのですが。

ダウンロードしてください
このカテゴリー内の他のコンポーネントこの著者のすべてのコンポーネント
コメントよくある質問と回答を求めた

プロパティ

作成:
11月13日12

最後の更新:
5月18日13

高解像度:
はい

推奨ブラウザ:
IE6、IE7、IE8、IE9、IE10は、Firefox、Safariの、オペラ、クローム

含まれるファイル:
JavaScriptのJS、HTML、CSS

ソフトウェアバージョン:
jQueryの

キーワード

eコマース, eコマース, 全商品, CSS, HTML, ジャバスクリプト, jqueryの, jQueryのスライダー, ページスライダー, pageAnimate, ページネーション, 王室のスライダー, スライダー