f_talebi
دوشنبه 31 تیر 1392, 13:03 عصر
دوستان کسی میتونه آموزش ساخت یه اسلاید عکس رو بزاره یا یه منبع خوب معرفی کنه؟ :ناراحت:
سایت بدون اون خیلی ساده میشه و اکثر سایت های مثلا املاک،دارویی و...این ها رو دارن :ناراحت:
سلام. البته بهترین منبع http://plugins.jquery.com/ هست . من یه پلاگین ساده بهتون معرفی میکنم که از همین سایت منبع پیداش کردم.
پلاگین fotorama . که اینم سایتشه و نحوه ی استفادش و ویژگی هاش رو شرح داده: http://fotorama.io/use/
فقط کافیه که اینا رو لینک کنید به صفحه تون :
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js"> </script>
<link href="http://fotorama.s3.amazonaws.com/4.1.17/fotorama.css" rel="stylesheet"> <!-- 14 KB -->
<script src="http://fotorama.s3.amazonaws.com/4.1.17/fotorama.js"></script> <!-- 28 KB -->
و بعد کافیه یه دایو که کلاسش "fotorama" باشه اضافه کنید و عکس هاتون رو توی اون دایو بذارید :
<div class="fotorama" >
<img src="gol1.jpg">
<img src="gol2.jpg">
<img src="do.jpg">
</div>
همین. حالا اگه میخواین ویژگی هاشو تغییر بدین پایین همین سایت fotorama (http://fotorama.io/use/) که دادم، در قسمت Customize نوشته با مثال.
اینم ی مثال که خودم بعضی ویژگی هاشو تغییر دادم:
<div align="center" class="fotorama" data-nav="thumbs" data-thumb-width="80"
thumb-height="80" data-loop="true" data-autoplay="true">
<img src="gol1.jpg">
<img src="gol2.jpg">
<img src="do.jpg">
</div>
data-nav="thumbs" رو اضافه کردم که میگه عکس ها بصورت کوچیک اون پایین نمایش داده بشن و data-thumb-width="80"
thumb-height="80" هم اندازه های اون عکس کوچیکو مشخص میکنه. و مثلا data-autoplay="true" کردم که بصورت اتوماتیک عکس ها تغییر کنند و...