با استفاده از این جی کوئری می توانید یک تب با افکت جذاب در پروژه خود ایجاد کنید
آموزش استفاده
- فر اخوانی css و js
<!-- stylesheets --> <link rel="stylesheet" type="text/css" href="css/style.css" /> <!-- javascript --> <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script> <script type="text/javascript" src="js/jquery.tools.min.js"></script> <script type="text/javascript" src="js/jquery.easing.1.3.js"></script> <!--[if lt IE9]><script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script><![endif]-->
- بعد از تگ <body>
<script type="text/javascript"> $(function() { var indicator = $('#indicator'), indicatorHalfWidth = indicator.width()/2, lis = $('#tabs').children('li'); $("#tabs").tabs("#content section", { effect: 'fade', fadeOutSpeed: 0, fadeInSpeed: 400, onBeforeClick: function(event, index) { var li = lis.eq(index), newPos = li.position().left + (li.width()/2) - indicatorHalfWidth; indicator.stop(true).animate({ left: newPos }, 600, 'easeInOutExpo'); } }); }); </script> <nav> <ul id="tabs"> <li><a class="current" href="#">تب اول</a></li> <li><a href="#">تب دوم</a></li> <li><a href="#">تب سوم</a></li> <li><a href="#">تب چهارم</a></li> <li><a href="#">تب پنجم</a></li> </ul> <span id="indicator"></span> </nav> <div id="content"> <section> <p>دنیای جی کوئری در بهمن ماه ۱۳۹۱ فعالیت خود را با هدف ایجاد منبعی برای دانلود سورس های آماده جی کوئری برای طراحان وب آغاز کرده است . وب سایت دنیای جی کوئری به عنوان اولین وب سایت در ایران به صورت تخصصی بر روی جی کوئری فعالیت میکند . فعالیت سایت به دو دسته تقسیم میشود :</p> <p>معرفی و دانلود جدید ترین example (مثال و سورس های آماده) جی کوئری همراه با دمو و آموزش و سورس . مستندات آموزشی برای تک تک مثال هایی که در وب سایت ارسال میشود بخش دمو و دانلود سورس و آموزش استفاده در نظر گرفته ایم که این خود باعث سهولت برای طراحان وب شده است . ۹۹٪ مثال هایی که در سایت ارسال میشود معمولاْ به صورت دو زبان فارسی و انگلیسی قرار داده شده است که برای طراحانی که قالب های راست چین یا چپ چین طراحی میکنند قابل استفاده باشد .</p> </section> <section> <p>دنیای جی کوئری در بهمن ماه ۱۳۹۱ فعالیت خود را با هدف ایجاد منبعی برای دانلود سورس های آماده جی کوئری برای طراحان وب آغاز کرده است . وب سایت دنیای جی کوئری به عنوان اولین وب سایت در ایران به صورت تخصصی بر روی جی کوئری فعالیت میکند . فعالیت سایت به دو دسته تقسیم میشود :</p> <p>معرفی و دانلود جدید ترین example (مثال و سورس های آماده) جی کوئری همراه با دمو و آموزش و سورس . مستندات آموزشی برای تک تک مثال هایی که در وب سایت ارسال میشود بخش دمو و دانلود سورس و آموزش استفاده در نظر گرفته ایم که این خود باعث سهولت برای طراحان وب شده است . ۹۹٪ مثال هایی که در سایت ارسال میشود معمولاْ به صورت دو زبان فارسی و انگلیسی قرار داده شده است که برای طراحانی که قالب های راست چین یا چپ چین طراحی میکنند قابل استفاده باشد .</p> </section> <section> <p>دنیای جی کوئری در بهمن ماه ۱۳۹۱ فعالیت خود را با هدف ایجاد منبعی برای دانلود سورس های آماده جی کوئری برای طراحان وب آغاز کرده است . وب سایت دنیای جی کوئری به عنوان اولین وب سایت در ایران به صورت تخصصی بر روی جی کوئری فعالیت میکند . فعالیت سایت به دو دسته تقسیم میشود :</p> <p>معرفی و دانلود جدید ترین example (مثال و سورس های آماده) جی کوئری همراه با دمو و آموزش و سورس . مستندات آموزشی برای تک تک مثال هایی که در وب سایت ارسال میشود بخش دمو و دانلود سورس و آموزش استفاده در نظر گرفته ایم که این خود باعث سهولت برای طراحان وب شده است . ۹۹٪ مثال هایی که در سایت ارسال میشود معمولاْ به صورت دو زبان فارسی و انگلیسی قرار داده شده است که برای طراحانی که قالب های راست چین یا چپ چین طراحی میکنند قابل استفاده باشد .</p> </section> <section> <p>دنیای جی کوئری در بهمن ماه ۱۳۹۱ فعالیت خود را با هدف ایجاد منبعی برای دانلود سورس های آماده جی کوئری برای طراحان وب آغاز کرده است . وب سایت دنیای جی کوئری به عنوان اولین وب سایت در ایران به صورت تخصصی بر روی جی کوئری فعالیت میکند . فعالیت سایت به دو دسته تقسیم میشود :</p> <p>معرفی و دانلود جدید ترین example (مثال و سورس های آماده) جی کوئری همراه با دمو و آموزش و سورس . مستندات آموزشی برای تک تک مثال هایی که در وب سایت ارسال میشود بخش دمو و دانلود سورس و آموزش استفاده در نظر گرفته ایم که این خود باعث سهولت برای طراحان وب شده است . ۹۹٪ مثال هایی که در سایت ارسال میشود معمولاْ به صورت دو زبان فارسی و انگلیسی قرار داده شده است که برای طراحانی که قالب های راست چین یا چپ چین طراحی میکنند قابل استفاده باشد .</p> </section> <section> <p>دنیای جی کوئری در بهمن ماه ۱۳۹۱ فعالیت خود را با هدف ایجاد منبعی برای دانلود سورس های آماده جی کوئری برای طراحان وب آغاز کرده است . وب سایت دنیای جی کوئری به عنوان اولین وب سایت در ایران به صورت تخصصی بر روی جی کوئری فعالیت میکند . فعالیت سایت به دو دسته تقسیم میشود :</p> <p>معرفی و دانلود جدید ترین example (مثال و سورس های آماده) جی کوئری همراه با دمو و آموزش و سورس . مستندات آموزشی برای تک تک مثال هایی که در وب سایت ارسال میشود بخش دمو و دانلود سورس و آموزش استفاده در نظر گرفته ایم که این خود باعث سهولت برای طراحان وب شده است . ۹۹٪ مثال هایی که در سایت ارسال میشود معمولاْ به صورت دو زبان فارسی و انگلیسی قرار داده شده است که برای طراحانی که قالب های راست چین یا چپ چین طراحی میکنند قابل استفاده باشد .</p> </section> </div>
سلام و خسته نباشید به خاطر سایت خوب و بار ارزشتون
لینک این سورس وصل نشده به فایلش.
لطفا بررسی شود
تشکر لینک تصحیح شد
معمولا این کار نمیکنم و تو دلم تشکر میکنم
ولی واقعا دلم نیومد
سایتهای تخصصی در هر زمینه ای که باشه جای تقدیر داره
امیدوارم افکت ها رو بیشتر کنید
مخصوصا تب رو که من خیلی بهش نیاز دارم 😀
مرسی از اینکه نظر دادید . حتماً مطالب بیشتری اضافه میشه
بسیار عالی و کابردی است
مثل اکثر وب سایت های تخصصی در زمینه کامپوتر خارجی و کمی ایرانی
مرسی حسن جان
سلام وقتتون بیخیر ممنون از اطلاعات مفیدتون
من یه تازه کارم و حدود دو سه هفته ای هست که به طراحی وب علاقه مند شدم.
یه سوالی ازتون داشتم اونم اینکه چطور میتونم اطلاعات متنی رو که از دیتابیس میخونم رو عینا تو صفحه نشون بدم یعنی اینکه هرجا اینتر خورده سطر بشکنه و توو یه سطر جدید نمایش داده شه یا توو 30% یه جایی نشون داده شه.
ممنون میشم اگه جواب بدین و معذرت می خوام که اینجا این سوال رو مطرح کردم.
سلام
منظورتون اینه که یک سری value دارید تو دیتابیس میخواید چاپشون کنید با دستور php ؟
اینو وقتی از یک ویرایشگر استفاده میکنید اون textaria ادیتور رو مقدارش رو چاپ کنید به صورت تگ p خودش چاپ میکنه زیر هم زیر هم
سلام من یک مشکل پیدا کردم و اینه که توی style.css تگ ندارم
چجوری میشه؟؟
تگ ندارم بلکه فقط body { ………} دارم
میبخشید نمیخوام ا س پ م بدم ولی متاسفانه مشکل پیدا کردم
من میخوام این کد رو داخل پستم نشون مبدم باید چه کار کنم؟
کد رو نباید تو css بزارید منظور از بعد تگ body کد html هست که باید بعد از اون بزارید
خیلی سایت خوب و کاملی دارید .
تشکر بابت زحمتی که می کشید. جای همچین سایتی به صورت فارسی واقعا خالی بود.
یه سوال هم دارم اونم اینکه تو ie کار نمی کنه باید چیکار کنیم.
مرسی یونس جان
ie نسخه چند ؟
ممنون از سایت خوبتون.
مرسی آقا رضا
سلام خسته نباشید
این کد تو فایر فاکس اجرا نمیشه لطفا بررسی کنین
سلام .
آقا جمال عزیز من چک کردم مشکلی نداره !
با تشکر وخسته نباشید از سایت خوبتون،آقا یه سوال داشتم،چجوری میشه از این تب در دو جای یک سایت استفاده کرد؟؟
عاااااااااااااالی بود
اگر بخوایم با باز شدن هر تب اظلاعات از دیتابیس خونده بشن باید چیکار کرد؟؟؟
چه جوری باید کد زد؟