Tabs - بطريقة اخرى (التنقل الاوتوماتك)

[owner]

السلام عليكم ..

اليوم عندي اكواد لعمل Tabs والتنقل بينهم اوتوماتك بمتغير الزمن



مثال مباشر : tab 1

عن فك الضغط عن الملفات سوف تجد :
-yetii.js
- Tab.html
- TabDown.html

الملف Tab.html هو الخاص بالمثال الذي بالاعلى ..

عند فتح الملف بواسطة اي محرر .
لأضافة TAb جديد . اسفل هذا الكود

 
    <li><a href="#tab4">صيانة مواقع المبتدئين</a></li>

اضف :

 
    <li><a href="#tab5">صيانة مواقع المبتدئين</a></li>

واسفل

        <div class="tab" id="tab4">
<h3><span lang="ar-bh">منتدى مواقع المبتدئين</span></h3>
<p>حصلت على موقعك للتو، وتريد المساعدة في عدد من الأمور المبدئية؟ دع المساحات 
 الأخرى لأصحابها، لا تضايقهم في أماكنهم المفضلة التي يحبون أن يتحدثوا فيها عن 
 صفات وتقنيات متقدمة على الإنترنت، وابدأ من هنا لو سمحت.</p>
        </div>

اضف

        <div class="tab" id="tab5">
<h3><span lang="ar-bh">منتدى مواقع المبتدئين</span></h3>
<p>حصلت على موقعك للتو، وتريد المساعدة في عدد من الأمور المبدئية؟ دع المساحات 
 الأخرى لأصحابها، لا تضايقهم في أماكنهم المفضلة التي يحبون أن يتحدثوا فيها عن 
 صفات وتقنيات متقدمة على الإنترنت، وابدأ من هنا لو سمحت.</p>
        </div>

=====================================
Tabs Botton



مثال مباشر :: tab 1

يمكنك اضافة Tab جديد بنفس الطريقة التي بالاعلى ..

لتغيير زمن التنقل بين الـTabs

<script type="text/javascript">
var tabber1 = new Yetii('aldirazi', 2);
tabber1.init(5);
</script>

مع تغيير الزمن من 5 الى اي رقم بالثواني ..

لتحميل الملفات ::

http://www.mrb3.com/JS/JS.rar
رابط اخر :
Lobortis > #6246773196 : JS.rar
رابط اخر 2 ::
TinyLoad.com :: Huge Files, Tiny Name

بالتوفيق ان شاء الله

[أبواب]

فعلاً أخوي انت اسم على مسمى

و بارك الله فيك و جاري التجربة و موافاتك بالنتائج

و لكن لدي سؤال لطالما فكرت في إيجاد حل له و لم استطع حتى اللحظة ! !

أخوي , هل بالإمكان جلب محتوى أحد التابات من صفحة html و بنفس المثال الذي أوردته لنا هنا

مع اختلاف أن النص مزروع بداخل الكود في مثالك ؟

ملاحظة : الله يرحم والديك إذا كتبت الرد انسخة قبل لا تعتمده أخاف أخسر ردك مره أخرى

دمت لنا علماً يحتذى به

تقديري و احترامي لشخصك الكريم

أخوك / أبواب

[owner]

فعلاً أخوي انت اسم على مسمى

و بارك الله فيك و جاري التجربة و موافاتك بالنتائج

و لكن لدي سؤال لطالما فكرت في إيجاد حل له و لم استطع حتى اللحظة ! !

أخوي , هل بالإمكان جلب محتوى أحد التابات من صفحة html و بنفس المثال الذي أوردته لنا هنا

مع اختلاف أن النص مزروع بداخل الكود في مثالك ؟

ملاحظة : الله يرحم والديك إذا كتبت الرد انسخة قبل لا تعتمده أخاف أخسر ردك مره أخرى

دمت لنا علماً يحتذى به

تقديري و احترامي لشخصك الكريم

أخوك / أبواب

اهلاً

اعتقد والله اعلم انك تقدر تعملها بـshtml

ابحث عنها في المنتدى وراح تلقى لها شرح ..

مع الاسف ماعندي خلفية عن هذي اللغة كان ساعدتك فيها :shy:

بالنسبة الى الملاحظة .. لا تخاف متعود

[أحمد خلف]

كود جميل ومفيد شكرا لك

[qmmary]

يعطيك العافية صراحة هاللغة جميلة جدا وانا قبل كم يوم عملت تطبيق بسيط لها وكانت النتائج كالتالي :

Prison break



تحياتي ،،،

[m7sen]

ما شاء الله جميل جداً

ما اجمل هذه التقنيه

طيب اخوي الي يبي يخليه يمين او ياسر شلون

يعطيك العافية ...

[seifss]

شكرا اخوووي owner تاثير رائع

[أبواسلام]

جزاك الله خيراً أخي الحبيب

إستسفار:-

1- كيف يمكن إضافة شعار وسط الـ tab بانه جاري التحميل أو كلمة جاري التحميل ؟
2- وهل يمكن اضافة iframe بدلاً من إضافة الكود كل مرة ؟

[Ala7lam]

جميل جدا أخي Owner،

أعجبني إهتمامك بالـTabs بشكل عام و خاصة الـAJAX منها نظرا لأهميتها في الوقت الحالي.

قد يتساءل البعض عن كيفية جعل العناوين صور بدل أن تكون كلمات فهل لك أن توضح الطريقة مشكورا ؟


يعطيك العافية، و تابع بارك الله فيك

[owner]

جميل جدا أخي Owner،

أعجبني إهتمامك بالـTabs بشكل عام و خاصة الـAJAX منها نظرا لأهميتها في الوقت الحالي.

قد يتساءل البعض عن كيفية جعل العناوين صور بدل أن تكون كلمات فهل لك أن توضح الطريقة مشكورا ؟


يعطيك العافية، و تابع بارك الله فيك

الله يعافيك

استبدل الـ

 
    <li><a href="#tab4">صيانة مواقع المبتدئين</a></li>

بــ

 
  <li><a href="#tab4"><img src="hallo.png" /></a></li>

hallo.png = اسم الصورة

1- كيف يمكن إضافة شعار وسط الـ tab بانه جاري التحميل أو كلمة جاري التحميل ؟

هذي الحركة لما يكون التنقل بـالاجاكس اما هذا المثال يستخدم الـJS

[Manaf00]

الله يعطيك العافيه ..
هل هذا بالـ جافا سكربت ؟
الله يوفقك ويجزاك خير .. ويزيدك علماً

[Mr.Mido]

السلام عليكم ورحمة الله وبركاته

استفسار بخصوص ال seo
هل هذه الخاصية تؤثر سلبا على نتيجة موقعى بمحركات البحث ؟ هل عند تحميل تاب اخر يقرأ محرك البحث التاب على انه صفحة جديدة لها محتويات كاملة كا عنوان الصفحة والكيورد والميتا تاج ام يعتبرهم كلهم مجرد صفحة واحدة ام ماذا ؟
اريد ان اعرف ان كانت هذه التقنية تؤثر سلبا ام ايجابا على محركات البحث ونتيجتها

[Arab Files]

يعطيك العافية اخوي
أنا مطبق فكرة المثال الذي وضعته للتحميل
لكن تواجهني مشكلة أو بالأصح منغص يجعلني أفكر في حذفها
وهي أنه وأثناء تحميل الصفحة تظهر محتويات جميع التبويبات تحت بعضها .. ولا يعود تنسيقها - أي التبويبات Tabs - إلا بعد ان ينتهي تحميل الصفحة تماماً !!
خصوصاً وأن الطريقة هذه أكررها في الصفحة الواحدة خمس مرات (لأنها عبارة عن معلومات عن بلدان) فتكون مثلاً .. معلومات عامة - أبرز المعالم - أبرز الشخصيات - أبرز المدن.
هل يوجد حل لهذه المشكلة؟
مع الشكر الجزيل

[owner]

السلام عليكم ورحمة الله وبركاته

استفسار بخصوص ال Search Engine Optimization
هل هذه الخاصية تؤثر سلبا على نتيجة موقعى بمحركات البحث ؟ هل عند تحميل تاب اخر يقرأ محرك البحث التاب على انه صفحة جديدة لها محتويات كاملة كا عنوان الصفحة والكيورد والميتا تاج ام يعتبرهم كلهم مجرد صفحة واحدة ام ماذا ؟
اريد ان اعرف ان كانت هذه التقنية تؤثر سلبا ام ايجابا على محركات البحث ونتيجتها

وعليكم السلام ورحمة الله وبركاته ..

بالنسبة الى موضوع الSEo فأعتقد انها ما تأثر لأنه عندما يدخل الـGooGleBots لموقع سوف يأرشف الTabs كلها وكل Tab لها عنوان خاص . اي كأنه كل Tabs موضوع جديد له عنوان خاص .
اما بالنسبة الى محتوياتها كصفحة جديدة فأعتقد بأني شرحت الفكرة فوق

بالتوفيق ان شاء الله

يعطيك العافية اخوي
أنا مطبق فكرة المثال الذي وضعته للتحميل
لكن تواجهني مشكلة أو بالأصح منغص يجعلني أفكر في حذفها
وهي أنه وأثناء تحميل الصفحة تظهر محتويات جميع التبويبات تحت بعضها .. ولا يعود تنسيقها - أي التبويبات Tabs - إلا بعد ان ينتهي تحميل الصفحة تماماً !!
خصوصاً وأن الطريقة هذه أكررها في الصفحة الواحدة خمس مرات (لأنها عبارة عن معلومات عن بلدان) فتكون مثلاً .. معلومات عامة - أبرز المعالم - أبرز الشخصيات - أبرز المدن.
هل يوجد حل لهذه المشكلة؟
مع الشكر الجزيل

اهلاً .

بالنسبة الى مشكلتك فهي طبيعية لانها تعتمد على تحميل الصفحة ككل وبعدها بأستخدام الجافا سكربت تتنقل بين الTabs .
والمشكلة تكمن في سرعة اتصالك و حجم الصفحة ..
يمكنك حل المشكلة عن طريق استخدام الاجاكس بدل من الJS وممكن تجد لها اكواد في المنتدى هنا . "Tabs With Ajax"

[الشبكة]

تم تطبيقها في المنتدى كـ لوحة شرف


ياليت تجيب لنا الاجاكس بدل من الJS مشكوراً