اسلایدشو حرفه ای Rhino Slider

دوشنبه, ۲۲ام خرداد , ۱۳۹۱ | ۳۵ دیدگاه

با سلام ، بالاخره بعد از مدت ها ، یه فرصت پیش اومد تا با یک آموزش دیگه خدمت شما دوستان باشم

توی این آموزش می خوام یک اسلایدشو خیلی حرفه ای و انعطاف پذیر رو بهتون معرفی کنم ، پس با من همراه باشید !

مرحله اول : دریافت پلاگین

اول از همه آخرین نسخه از سورس اصلی پلاگین رو دریافت کنید : لینک دریافت پلاگین

مرحله دوم : اضافه کردن فایل ها

برای راه اندازی این پلاگین باید فایل های ضروری رو توی تم خودتون کپی کنید که توی اون فایل که توی مرحله قبل دانلود کردید هست

اضاقه کردن استایل مورد نیاز

<link type="text/css" rel="stylesheet" href="/css/rhinoslider.css">

برای راه اندازی این پلاگین به کتابخانه جی کوئری ۱٫۴٫۲ یا بالاتر نیاز دارید

<script type="text/javascript" src="/js/jquery-1.7.1.min.js"></script>
<script type="text/javascript" src="/js/rhinoslider.js"></script>

مرحله سوم : فراخوانی تابع

خوب تا اینجا پلاگین رو نصب کردیم و حالا باید توی تم فراخوانی کنیم ، واسه ای کار کد زیر رو پایین فایل قالبتون قبل از بسته شدن تگ BODY قرار بدید

<script type="text/javascript">
$(document).ready(function() {
$('#your-id').rhinoslider({
 options: value
 });
});
</script>

چند تا نکته مهم :
به جای your-id آی دی DIV مورد نظر خودتون رو بزارید
به جای option می تونید از فابلیت های پلاگین استفاده کنید ، مثل کد زیر :

<script type="text/javascript">
$(document).ready(function() {
 $('#slideshow').rhinoslider({
 effect: 'transfer'
 });
});
</script>

بقیه تنظیمات پلاگین رو می تونید از اینجا ببینید یا می تونید به این صفحه برید و تنظیمات رو انجام بدید و کد رو تحویل بگیرید

Be Sociable, Share!


۳۵ دیدگاه


  1. حسین
    ۲۹ خرداد ۱۳۹۴

    به رسم ادب خواستم ازتون تشکر کنم واقعا متشکرم …….




  2. بهنام
    ۲۲ مرداد ۱۳۹۴

    تشکر فراوان بابت آموزش هاتون. خیلی ممنون.



دیدگاه خود را بنویسید