 |
|
|
|
خوش امدید به AlmasSoft Forums . شما در حال حاضر در حال مشاهده فروم به عنوان یک مهمان هستید که به شما اجازه دسترسی محدود به نمایش در بحث ها ، و استفاده از امکانات ما داده شده است . با پیوستن به ما به صورت ازاد برای دسترسی به پست ها , پیغام خصوصی به کاربران دیگر (PM), پاسخ به نظر سنجی , مطالب و دسترسی به بسیاری از دیگر امکانات ویژه . ثبت نام سریع , ساده و کاملا رایگان. , پیوستن به انجمن ما برای ثبت نام ! در صورت داشتن هرگونه مشکل در روند ثبت نام و یا ورود به حساب خود ، لطفا تماس بگیرید تماس با ما. |
| آخرين ارسالات تالار |
|
|||||||
ثبت نام سریع
|
 |
|
|
LinkBack | ابزارهای موضوع | جستجو در موضوع | نحوه نمایش |
08-25-2010, 10:52 PM
|
#1 | |||||||||||||||||
|
تاریخ عضویت: May 2010
محل سکونت: گیلان
نوشته ها: 1,240
نوع ماشين :
 نوع گوشي همراه :
 نوع سيم کارت:
 تيم فوتبال :
حالت من:
سپاس ها: 1
سپاس شده 7 در 7 پست
درجه: 30 [  ]سابقه: 148 / 740
 |
آموزش طراحی وب سایت – SlideShow With Amazing Effect
در بسیاری از مواقع ایجاد تحرک و پویایی در طراحی وب سایت بسیار مورد نیاز است . اسلاید شو ها (Slide show) یکی از بهترین گزینه ها برای ایجاد تحرک و پویای در وب سایت هستند که البته از نظر کاربری وب سایت نیز نقش بسیار مهمی دارند.
در این خودآموز با یک نمونه از ساده ترین اسلاید شو ها که دارای دو نمونه اسلاید متفاوت است آشنا خواهیم شد.البته این اسلاید شو در عین سادگی کاربردهای بسیار زیادی نیز دارد و امیدوارم مورد استفاده قرار گیرد. طبق معمول در ابتدایی ترین مرحله ، نمونه نهایی این اسلاید شو را در اینجا ملاحظه نمائید و سپس فایلهای مربوط به این اسلاید شو را دانلود کنید. [برای مشاهده لینک ها باید عضو سایت شوید ، برای عضویت اینجا کلیک کنید ...] [برای مشاهده لینک ها باید عضو سایت شوید ، برای عضویت اینجا کلیک کنید ...] در مرحله اول فایلهای js و css مربوط به این اسلاید شو را با استفاده از کدهای HTML زیر در صفحه وب خود قرار می دهیم.قبل از انجام این کار به آدرس دهی ها بسیار دقت کنید و آدرس فایلها را به طور صحیح در کد HTML وارد نمائید. [برای مشاهده لینک ها باید عضو سایت شوید ، برای عضویت اینجا کلیک کنید ...] 1<script type="text/javascript" src="js/jquery-1.3.js"></script> 2<script type="text/javascript"src="js/jquery.cycle.all.js"></script> کدهای بالا را در قسمت head صفحه HTML خود وارد نمائید. سپس نوبت به قرار دادن لینک فایل css مربوط به اسلاید شو میرسد که به روش زیر وارد صفحه وب می شود. [برای مشاهده لینک ها باید عضو سایت شوید ، برای عضویت اینجا کلیک کنید ...] [برای مشاهده لینک ها باید عضو سایت شوید ، برای عضویت اینجا کلیک کنید ...][برای مشاهده لینک ها باید عضو سایت شوید ، برای عضویت اینجا کلیک کنید ...] 1<link rel="stylesheet" type="text/css" media="screen" href="css/screen.css" /> پس از قرار دادن لینک فایلهای مورد نیاز در قسمت head صفحه وب نوبت به فراخوانی تابع جاوااسکریپت jquery.cycle.all.js در صفحه وب میرسد که توسط کد زیر انجام می گیرد. [برای مشاهده لینک ها باید عضو سایت شوید ، برای عضویت اینجا کلیک کنید ...] [برای مشاهده لینک ها باید عضو سایت شوید ، برای عضویت اینجا کلیک کنید ...][برای مشاهده لینک ها باید عضو سایت شوید ، برای عضویت اینجا کلیک کنید ...] 1<script type="text/javascript"> 2 $(document).ready(function(){ 3 $('#myslides').cycle({ 4 fx: 'fade', 5 speed: 5000, 6 timeout: 2000 7 }); 8 }); 9</script> پس از وارد نمودن کد اسکریپت بالا تابع در صفحه وب فراخوانی می شود و در اینجا کافیست ما از style های تعریف شده برای این تابع استفاه نمائیم. [برای مشاهده لینک ها باید عضو سایت شوید ، برای عضویت اینجا کلیک کنید ...] [برای مشاهده لینک ها باید عضو سایت شوید ، برای عضویت اینجا کلیک کنید ...][برای مشاهده لینک ها باید عضو سایت شوید ، برای عضویت اینجا کلیک کنید ...] 1<body> 2 <div id="myslides"> 3 <img src="images/capitol.jpg" /> 4 <img src="images/flowers.jpg" /> 5 <img src="images/countryscene.jpg" /> 6 </div> 7</body> ملاحظه می نمائید که برای مشخص نمودن تصاویری که این تابع باید آنها را اسلاید کند در بالا از id=”myslides” استفاده شده است. این تابع هر تعداد تگ <img/> را که در بین تگ با id=”myslides” قرار دارد را اسلاید می کند. برای تجربه افکت های مختلف می توانید در script فراخوانی تابع در قسمت fx: ‘fade’, از افکت های مختلف دیگر استفاده کنید. در زیر لیست تعدادی ز این افکت ها را ملاحظه می فرمائید. فقط کافیست که عبارت افکت مورد نظر را به جای fade در مثال بگذارید و افکت جدید را تجربه کنبد. همچینین در این تابع می توانید سرعت وزمان توقف اسلاید ها را نیز تعیین نما یئید. واحد اعداد میلی ثانیه است به این معنی که هر ۱۰۰۰ میلی ثانیه معادل یک ثانیه است.
|
|||||||||||||||||
|
  
|
|
5 آخرین موضوعات ارسال شده sepastian
|
|||||
| موضوعات | انجمن | آخرین ارسال کننده | پاسخ ها | نمایش ها | آخرین ارسال |
|
امکان اجاره کتاب الکترونیکی توسط کاربران Kindle
|
گفتگوی آزاد | sepastian | 0 | 72 | 04-25-2011 07:40 PM |
|
امکان اجاره کتاب الکترونیکی توسط کاربران Kindle
|
گفتگوی آزاد | sepastian | 0 | 72 | 04-25-2011 07:40 PM |
|
امکان اجاره کتاب الکترونیکی توسط کاربران Kindle
|
گفتگوی آزاد | sepastian | 0 | 72 | 04-25-2011 07:40 PM |
|
نوکیا، مایکروسافت پیوندتان مبارک!
|
نوکیا | sepastian | 0 | 76 | 02-28-2011 06:23 PM |
|
نوکیا، مایکروسافت پیوندتان مبارک!
|
نوکیا | sepastian | 0 | 76 | 02-28-2011 06:23 PM |
|
| کاربران در حال دیدن موضوع: 1 نفر (0 عضو و 1 مهمان) | |
| ابزارهای موضوع | جستجو در موضوع |
| نحوه نمایش | |
|
|
|
موضوعات مشابه
|
||||
| موضوع | نویسنده موضوع | انجمن | پاسخ ها | آخرين نوشته |
| ۳۲ راه برای افزایش بازدید یک سایت | سالارتبریز | مقالات، کتابهای الکترونیکی و منابع آموزشی | 0 | 08-22-2010 07:24 PM |
| راه برای افزایش بازدید یک سایت | سالارتبریز | مقالات، کتابهای الکترونیکی و منابع آموزشی | 0 | 08-21-2010 09:45 PM |
| چند نکته برای مدیران سایت جهت اضافه کردن سایت به موتورهای جستجو | sepastian | مقالات، کتابهای الکترونیکی و منابع آموزشی | 0 | 08-20-2010 11:07 PM |
| چرا سایت ما در موتورهای جستجو ثبت نمی شود؟ | sepastian | مقالات، کتابهای الکترونیکی و منابع آموزشی | 0 | 08-20-2010 10:49 PM |
| آموزش طراحی و کدنویسی وب سایت (از ابتدا تا انتها) | sepastian | آموزش Html وCss | 0 | 05-25-2010 12:28 PM |
|
|
|
حالت خطی
