من این مطلب رو از سایت ittutorial.ir براتون می گذارم
اسلایدشو حرفه ای Rhino Slider
با سلام ، بالاخره بعد از مدت ها ، یه فرصت پیش اومد تا با یک آموزش دیگه خدمت شما دوستان باشم
توی این آموزش می خوام یک اسلایدشو خیلی حرفه ای و انعطاف پذیر رو بهتون معرفی کنم ، پس با من همراه باشید !
مرحله اول : دریافت پلاگین
اول از همه آخرین نسخه از سورس اصلی پلاگین رو دریافت کنید :
مرحله دوم : اضافه کردن فایل ها
برای راه اندازی این پلاگین باید فایل های ضروری رو توی تم خودتون کپی کنید که توی اون فایل که توی مرحله قبل دانلود کردید هست
اضاقه کردن استایل مورد نیاز
1 |
< link type = "text/css" rel = "stylesheet" href = "/css/rhinoslider.css" > |
برای راه اندازی این پلاگین به کتابخانه جی کوئری ۱٫۴٫۲ یا بالاتر نیاز دارید
1 |
< script type = "text/javascript" src = "/js/jquery-1.7.1.min.js" ></ script > |
2 |
< script type = "text/javascript" src = "/js/rhinoslider.js" ></ script > |
مرحله سوم : فراخوانی تابع
خوب تا اینجا پلاگین رو نصب کردیم و حالا باید توی تم فراخوانی کنیم ، واسه ای کار کد زیر رو پایین فایل قالبتون قبل از بسته شدن تگ BODY قرار بدید
1 |
< script type = "text/javascript" > |
2 |
$(document).ready(function() { |
3 |
$('#your-id').rhinoslider({ |
چند تا نکته مهم :
به جای your-id آی دی DIV مورد نظر خودتون رو بزارید
به جای option می تونید از فابلیت های پلاگین استفاده کنید ، مثل کد زیر :
1 |
< script type = "text/javascript" > |
2 |
$(document).ready(function() { |
3 |
$('#slideshow').rhinoslider({ |
بقیه تنظیمات پلاگین رو می تونید از اینجا ببینید یا می تونید به این صفحه برید و تنظیمات رو انجام بدید و کد رو تحویل بگیرید