PDA

View Full Version : تغییر اندازه عکس در این اسلاید شو



sg.programmer
دوشنبه 22 مهر 1392, 17:23 عصر
سلام
من از این اسلاید شو میخوام استفاده بکنم زمانی که عکسهام در سایز کوچیک باشن بصورت کوچیک نمایش میده - چطوری میتونم در برنامه تغییر ایجاد کنم که اگر عکسها کوچک هم بود بصورت اندازه اصلی عکس که در برنامه نشون داده شده نمایش بده
تغییرات اندازه در jquery اعمال شده و نمیدونم چطوری و کجا هست که تغییر باید بدم
download
http://iprodev.com/wp-content/plugins/download-monitor/download.php?id=6
‍‍Demo
http://iprodev.com/iview/
web
http://iprodev.com/2012/07/iview/

sg.programmer
سه شنبه 23 مهر 1392, 10:45 صبح
اگه ممکنه فقط بگید که قسمت سایز عکس ها از کجا تغییر ‍‍‍میکنه هم کافیه

ArtMiz
سه شنبه 23 مهر 1392, 13:24 عصر
برو تو پوشه Css. توش چند تا پوشه skin هست. هر کدومش رو باز کنی در #iview .iviewSlider می تونی طول و عرض عکست رو مشخص کنی

sg.programmer
شنبه 27 مهر 1392, 20:10 عصر
سلام
تشکر از پاسختون
این قسمت که فرمودید خود اسلایدر را تغییر میده ولی من میخوام خود اون عکس را تغییر بدم که اگه یه موقع عکس بزرگتر یا کوچکتر از اندازه اسلایدر بود به اندازه اسلایدر کشیده یا کوچکتر بشه



#iview .iviewSlider {
display: block;
width: 900px;
height: 400px;
overflow: hidden;
border-radius: 4px;
}

الهام قدوسی
یک شنبه 28 مهر 1392, 01:29 صبح
سلام
برای کار عکس رو تنظیم کن با photoshop سایز -مثلا یه عکسی رو دانلود کردم اما زیادی بزرگ هست تو image size فتوشاپ عکس رو به اندازه که میخوام بزرگ و کوچیک میکنم بقیش رو هم که تو بر اساس عکسی که داری اسلاید رو تنظیم میکنی .میتونی هم برای عکست تو تعریفات css مثلا اگه عکس شماره یک رو پیوست کردی به پیج بهش یه کلاس بدی یعنی داخلش
اینجوری< img src=(./image1) class=test > بعد داخل کلاست برا width=100%و برای height=100%اینم تا حدودی عکس تو رو میکشه به اندازه اسلایدر بقیش باید در نظر بگیری خودت و عکس متناسب بذاری با سایزی که اسلایدر بزرگ میشه.

sg.programmer
یک شنبه 28 مهر 1392, 16:40 عصر
سلام
تشکر از توجهتون
نه این یه قسمتی در برنامه هست که کاربر زحمت آپلود عکس را میکشه و نباید خودشو درگیر اینچنین موضوعاتی بکنه

Javidhb
یک شنبه 28 مهر 1392, 17:25 عصر
بهتره اینکار رو سمت سرور انجام بدید... و عکسی که تغییر سایز پیدا کرده رو ذخیره کنید.

اگه قبل از آپلود و سمت کاربر میخاید اینکار انجام بشه:
1. باید یه canvas با طول و عرض مد نظرتون درست کنید و عکسی که کاربر میخاد آپلود کنه رو توی canvas نشون بدید. (لینک (http://www.w3schools.com/tags/canvas_drawimage.asp))

canvas.drawImage()

2. باید یه عکس از canvas بسازید (که طول و عرضش همونیه که شما میخاید) و اونو به src یه img اختصاص و آپلود کنید.(پسوند عکس میتونه jpg، png و ... باشه) (لینک (http://www.rgraph.net/blog/2013/april/an-example-of-the-html5-canvas-todataurl-function.html))

canvas.toDataURL(image/png)
!توی مرورگرهای قدیمی پشتیبانی نمیشه!


نمونه کد:
https://blog.liip.ch/archive/2013/05/28/resizing-images-with-javascript.html

دمو:
http://clientside-resize.labs.liip.ch/

sg.programmer
یک شنبه 28 مهر 1392, 21:11 عصر
تشکر - الان دارم از این چنین روشی استفاده میکنم که سایز عکس را تغییر میده بعد آپلود میکنه . ولی نمیخوام فعلا از این روش استفاده کنم
میخوام جایی در برنامه که عکس به اسلایدر اختصاص پیدا میکنه در همون قسمت تغییرات سایزش داده بشه