امروز : 1
ديروز : 1
افراد آنلاين : 1
همه : 343
 
نوشته شده توسط : arena

 

ايجادوبلاگ با قالب شو

 

اين اسلايدشو با تكنولوژي جاوااسكريپت ساخته ميشود و با سرويس هاي وبلاگدهي رايج كاملا سازگاري دارد
ابتدا اين كد رو قبل از كد

وبلاگ/وبسايتتون قرار بدهيد

 

اين كد بخش اصلي جاوااسكريپت اسلايدشو رو بارگذاري ميكند ، در صورتي كه فضاي ميزبان (هاستينگ) داريد ميتونيد اين فايل رو دريافت كنيد تو ضميمه اين پست و تو فضاي خودتون قرارش بديد. در صورتي هم كه نداريد يا نميخواهيد فايل رو در فضاي ميزبان خودتون قرار بديد هيچ مشكلي نيست از همين آدرس استفاده كنيد.
حالا كد زير رو قبل از

<script type="text/javascript" src="http://www.2createawebsites.com/resources/howtocreateawebsitefadeslide.js"></script>

و بعد از كدي كه در بالا اضافه كرديد بزاريد:


<script type="text/javascript">
var mygallery=new fadeSlideShow({
wrapperid: "fadeshow2", //ID of blank DIV on page to house Slideshow
dimensions: [600, 400], //width/height of gallery in pixels. Should reflect dimensions of largest image
imagearray:  [
      ["http://www.2createawebsites.com/resources/slide-show-how-2-create-a-website-image-1.jpg"],
      ["http://www.2createawebsites.com/resources/slide-show-how-2-create-a-website-image-2.jpg"],
      ["http://www.2createawebsites.com/resources/slide-show-how-2-create-a-website-image-3.jpg"],
      ["http://www.2createawebsites.com/resources/slide-show-how-2-create-a-website-image-4.jpg"],
["http://www.2createawebsites.com/resources/slide-show-how-2-create-a-website-image-5.jpg"]
],
displaymode: {type:'auto', pause:1000, cycles:0, wraparound:false},
persist: false, //remember last viewed slide and recall within same session?
fadeduration: 2000, //transition duration (milliseconds)
descreveal: "ondemand",
togglerid: ""
})
</script>

خط چهارم اين كد دو شماره [۶۰۰, ۴۰۰] كه با رنگ نارنجي مشخص شدند اندازه اسلايدشو رو تعيين ميكندبر حسب پيكسل براي تغيير اندازه اسلايدشو و تنظيم اون بر اساس وبلاگ/وبسايتتون كافيه فقط شماره ها رو تغيير بديد اولي اندازه افقي و دومي اندازه عمودي اسلايدشو هست.

پنج خط كه به رنگ سبز مشخص شدند آدرس عكس هاييه كه اسلايدشو بايد نمايش بده

      [“http://www.2createawebsites.com/resources/slide-show-how-2-create-a-website-image-1.jpg“],

بجاي رنگ آبي در خط بالا آدرس تصوير دلخواهتون رو بزاريد

براي اضافه كردن تصوير بيشتر يا كم كردن تعداد تصاوير محدوديتي وجود نداره

ميتونيد با حذف خط تصوير رو حذف كنيد

فقط دقت كنيد كه اول خط تمام خط كدهاي تصاوير مثل خط هايي كه با سبز نشون داده شده با كاما , شروع ميشه به غير از آخرين تصوير، وقتي تصويري رو حذف يا اضافه كرديد دقت كنيد اول خط تمام آدرس عكس ها با , شروع شده باشه و آخرين عكس بدون , باشه ، مثل نمونه ي سبز رنگ شده.

دو خط بعد شماره اي هست كه با رنگ قرمز مشخص شده اين شماره زمان نمايش هر تصوير رو نشون ميده كه هر ۱۰۰۰ شماره به معناي يك ثانيه ميباشد

۱۰۰۰ برابر با ۱ ثانيه ، ۲۰۰۰ برابر با ۲ ثانيه و …

و دو خط بعد از اون يه شماره ديگه هست كه با رنگ قهوه اي مشخص شده اين شماره سرعت افكت تغيير تصاوير رو مشخص ميكنه ، اين زمانيه كه تصوير تار ميشه و جاي خودش رو به تصوير بعدي ميده اين شماره هم مثل شماره قبل هر ۱۰۰۰ شماره يك ثانيه محسوب ميشود.

حالا نوبت به كدي ميرسه كه اسلايدشو رو نمايش ميده…
اين كد رو جايي بزاريد كه ميخواهيد اسلايدشو اونجا نمايش داده بشه:

 

ايجادقالب با اسلايد شو

 

حالا اسلايدشو شما آمادست ذخيره كنيد و وبتون رو بروز كنيد و لذت ببريد 
فايل ضميمه:
فايل اصلي جاوااسكريپت (در ابتداي بحث به آن اشاره شد)
 فايل نمونه آماده اسلايدشو
اگر در ساخت اين اسلايدر مشكلي داشتيد يا سوالي بود از طريق ديدگاه همين جا بپرسيد ، پاسخ براتون ايميل ميشود…



:: موضوعات مرتبط:

:: برچسب‌ها: ،
تاریخ انتشار : ۲۸ تير ۱۳۹۵ | نظرات (0)
[ ۱ ]