قرار دادن عکس با قابلیت زوم

[reza41]

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

<b><font color=red>فقط کاربران عضو انجمن می توانند لینک ها را مشاهده کنند</font></b> ... i/map.html

[نوید]

سلام
شما می توانید از پلاگین های lightbox به این منظور بهره ببرید
موفق باشید

[reza41]

با سلام
ببخشید من گشتم ولی چنین پلاگینی رو پیدا نکردم. چندتا بودن که lightbox هم در نامشان بود ولی هیچ کدام کارشان این نبود.
میشه بیشتر توضیح بدین؟
ببخشید

[مهدی.]

سلام

بنده پلاگین Simple Image Gallery رو به شما پیشنهاد میکنم.

از سایت joomlaworks میتونید این پلاگین را دریافت کنید و نصب کنید.

ضمن اینکه پلاگین لایت باکس هم پلاگین قدرتمندی هست.

هیچکس تنهاتر از خدا نیست

[reza41]

پلاگین Simple Image Gallery رو نصب کردم و همین طور rokbox رو هم امتحان کردم هر دو تا کار می کردند ولی مشکل اینجا ست که وقتی عکس بزرگ میشه همه عکس نیست حالا یا چون عکس خیلی بزرگه این طور میشه یا دلیل دیگه ای داره یعنی با اینکه صفحه اسکرل میشه ولی همه عکس کاملا باز نمیشه و یه کم از حاشیه هاش نیست.

[مهدی.]

با ریزولیشین مانیتور در اندازه بزرگتری چک کنید.

میتونید در تنظیمات این پلاگینها مشخص کنید فایل نهایی را ویرایش کند یا خام نمایش دهد. میتونید در فایل css پلاگین فوق مشخص کنید تصاویر نهایی را که در تگ img قرار میگیرند در اندازه 100 درصد صفحه باشند.

هیچکس تنهاتر از خدا نیست

[reza41]

سلام
در پلاگین simple... که چنین گزینه هایی نبود و باModalizer هم نتونستم کار کنم کسی می تونه توضیحش بده
ممنون

[مهدی.]

میتونید در فایل css پلاگین فوق مشخص کنید تصاویر نهایی را که در تگ img قرار میگیرند در اندازه 100 درصد صفحه باشند.

[reza41]

ببخشید که من بی سوادم
این تمام کدهای فایل سی اس اس پلاگین بود من نفهمیدم باید کجاش معلوم کنم.

/* ---Simple Image Gallery--- */
.sig {clear:both;margin:16px 4px;padding:0px;display:table-cell;}
.sig_clr {clear:both;}
.sig_cont {float:left;}
.sig_thumb {float:left;margin:0px 10px 10px 10px;padding:0px;background:url(shadowAlpha.png) no-repeat bottom right !important;background:url(shadow.gif) no-repeat bottom right;}
.sig_thumb img {display:block;position:relative;background:#FFF;b order:1px solid #ccc;margin:-5px 5px 5px -5px;padding:4px;}
/* ---Slimbox--- */
#lbOverlay {position:absolute;left:0;width:100%;background-color:#000;cursor:pointer;}
#lbCenter, #lbBottom {position:absolute;left:50%;overflow:hidden;backgr ound-color:#fff;}
.lbLoading {background:#fff url(loading.gif) no-repeat center;}
#lbImage {border:10px solid #fff;}
#lbPrevLink, #lbNextLink {display:block;position:absolute;top:0;width:50%;o utline:none;}
#lbPrevLink {left:0;}
#lbPrevLink:hover {background:transparent url(prevlabel.gif) no-repeat 0% 15%;}
#lbNextLink {right:0;}
#lbNextLink:hover {background:transparent url(nextlabel.gif) no-repeat 100% 15%;}
#lbBottom {font-family:Verdana, Helvetica, sans-serif;font-size:10px;color:#666;line-height:1.4em;text-align:left;border:10px solid #fff;border-top-style:none;}
#lbCloseLink {display:block;float:right;width:66px;height:22px; background:transparent url(closelabel.gif) no-repeat center;margin:5px 0;}
#lbCaption, #lbNumber {margin-right:71px;}
#lbCaption {font-weight:normal;}
#lbCaption b {color:#C63C13;font-size:11px;}
#lbOverlay,#lbCenter,#lbBottom,#lbPrevLink,#lbNext Link {z-index:999;} /* JoomlaWorks fix for Slimbox */
/* --- END --- */