کد جاوااسکریپت آلبوم تصاویر در سایت یا وبلاگ شما

- visibility ۶۱ mode_comment

متوجه شدم که مدتیه کد جاوااسکریپت براتون نگذاشتم .

به همین خاطر امروز اومدم و یه کد بسیاز زیبا و کاربردی رو براتون آوردم .

کد جاوا اسکریپت یک آلبوم تصاویر با نمایش اسلایدی که عکسهای اون رو خودتون میتونید انتخاب کنید .

آلبومی که در اون تصاویر با سایز کوچک نمایش داده میشود و با زدن دکمه next به تصویر بعدی میرید و با کلیک روی هر تصویر می تونید تصویر اصلی (بزرگتر) رو ببینید . ضمنا در این آلبوم تصاویر بعدی بدون اینکه شما متوجه باشید در پس زمینه لود میشن که باعث سرعت بخشیدن به نمایش تصاویر میشه .

:: نمایش نمونه ی این آلبوم رو می تونید در زیر ببینید :

دوست دارید چنین آلبومی رو با تصاویر دلخواه خودتون در سایت یا وبلاگتون داشته باشید ؟؟؟

پس برای دریافت کد و استفاده از این آلبوم در ادامه مطلب با ما باشید ...

=> دریافت کد جاوااسکریپت آلبوم تصاویر1  <=

 

و اما توضیحات مربوط به کد :

کد این آلبوم به شکل زیره :

<script language="JavaScript">
albumTitle="آلبوم تصاویر"
photos=new Array()
picIndex=0
photos[0]="http://www.7Learn.com/js/jsAlbum1/a.jpg"
photos[1]="http://www.7Learn.com/js/jsAlbum1/b.jpg"
photos[2]="http://www.7Learn.com/js/jsAlbum1/c.gif"
photos[
3]="http://www.7Learn.com/js/jsAlbum1/d.jpg"
</script>
<script language="javascript" src="http://www.7Learn.com/js/jsAlbum1/jsAlbum1.js"></script>

:: در خطی که با رنگ قهوه ای مشخص کردم ، می تونید تیتر یا عنوان دلخواهی رو برای آبوم خودتون مشخص کنید . تیتر شما در این خط باید درون " " قرار داشته باشد .

:: در قسمتی هم که با رنگ آبی مشخص شده شما می تونید هر تعداد تصویر که بخواهید به آلبومتان اضافه کنید . مثلا در کد بالا 4 تصویر (تصاویر شماره 0 تا 3) قرار دارند . برای افزودن تصویر جدید (تصویر پنجم) این خط رو بعد از چهار خط آبی رنگ اضافه می کنیم :

photos[4]="ImageUrl"

 که  ImageUrl آدرس تصویر جدید هست .

دقت کنید که هر تصویر جدیدی که بخواید اضافه کنید ، شمارش باید یکی (فقط یکی) بیشتر از شماره ی تصویر آخری در کد باشه . در غیر این صورت در نمایش تصاویر ممکنه اخلال بوجود بیاد . مثلا در کد بالا که شماره آخرین تصویر 3 است (به رنگ سبز) ، شماره تصویر جدید 4 میشه ، بعدی 5 و بعدش 6 و ...

:: در صورت تغیر بقیه ی قسمت های کد ،  آلبوم یا تصاویر آن نمایش داده نمیشود .

 

=> دریافت کد جاوااسکریپت آلبوم تصاویر1  <=

 

موفق و پیروز باشید .

comment دیدگاه کاربران
mrg1367

فک کنم آپش نکردید …..آخه من دوباره آلبوم رو گرفتم ولی تفییری نکرده !!!

لقمان آوند

احتمالا کد جاوااسکریپتش کش شده در مرورگرت . کنترل F5 بزن که از نو لود بشه …

mrg1367

ممنون بالاخره درست شد !!! 😛

mrg1367

سلام آقای آوند …کاش خود فایل جاوا اسکریپتشو هم برای دانلود می ذاشتید …..اینجوری تغییر دادن کدها هم برامون امکان پذیره …..بازم ممنون

saye00

سلام ممنون از سایت فوق العادتون
میشه بهم بگین که کد جاوا اسکریپت دکمه های next و previous آلبوم عکس چیه؟

اسماعیلی

سلام
ممنون ازسایت عالیتون خواستم ببینم این آلبوم رومیشه سایزش رو بزرگش کرد؟

لقمان آوند

سلام
فعلا نه و سایزش در همین اندازه است .

shiva

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

به ایمیلم هم میتونید ارسال کنید 😛

لقمان آوند

سلام
این آلبوم فعلا سایزش ثابته و قابل تغیر نیست . ان شاءالله در ورژن بعدی این مورد اعمال میشه .

behzadkhan2012

خدا پدر و مادرتو بیامرزه مرد
خدا سلامتت کنه مرد
خدا عوضت بده مرد

erfan1

به خاطر این کد ممنونم.
میخواستم ببینم چطور میشه کدهای جاوااسریپت در میهن بلاگ در کنار مطالب وبلاگ نمایش داده بشه نه در کنار آمار بازدید سایت و آرشیو مطالب.
الان من کد اسکریپت آلبوم تصاویر رو که گذاشتم همه تصاویر در قسمت سمت راست وبلاگم یعنی زیر قسمتی که آرشیو مطالب نوشته شده نمایش داده می‌شوند.

میلاد حیدری

کدهای جاوا اسکریپت را در میهن بلاگ بدون هیچگونه محدودیتی و در هر مکانی از قالب وبلاگ خود می توانید قرار دهید ، اما اگر شما می خواهید کدهای جاوا اسکریپت خود را در بخش تنطظیمات وبلاگ اضافه نمائید ، برای تعیین مکان آن ، در بخش قالب شما کلمه کلیدی به نام [cb:blog_script] وجود دارد ، اگر این کلمه کلیدی تغییر مکان دهید ، اسکریپت های شما به نمایش در خواهد آمد ولی اگر دوست دارید اسکریپت های خود را مستقیما در ویرایش قالب وارد نمائید ، می توانید آن را بین دو نگ اسکریپت قرار دهید و ان را قرار دهید

erfan1

خوب پس [cb:blog_script] رو به چی تغییر بدم.

میلاد حیدری

این کلمه رو تغییر نمیدهند ، فقط میتوانید مکان آن را به جای دلخواه تغییر دهید…

erfan1

متوجه منظورتون شدم اما باز هم نمیتونم مشکلم رو حل کنم. 😥

مهران

ممنون –
یکمی نیاز به تغییر اندازه داره

ولی بدرد میخوره

ممنون

نیاز به لاگین

برای ارسال دیدگاه و یا پرسیدن سوال خود در این قسمت، باید در سایت لاگین شوید.
1 3 4 5