PDA

View Full Version : سوال: بزرگ شدن عکس با رفتن نشانگر



mahtab s
سه شنبه 20 مهر 1389, 14:34 عصر
سلام دوستان . من تو یک صفحه یک عکس رو از تو دیتابیس آوردم و نشون میدم . میخوام وقتی کاربر با نشانگر روی عکس بره عکس در سایز بزرگ نشون داده بشه و وقتی که نشانگر از روی عکس بره محو بشه . ممنون میشم کسی کمک کنه .. مرسی

Houmehre
چهارشنبه 21 مهر 1389, 06:27 صبح
سلام فکر کنم اگه سوالت رو توی بخش یکی از کتابخونه ها مطرح می کردی جواب بهتری میگرفتی.
به هر حال اینجا هم مربوط به جاوا اسکریپته، من جواب رو با کتابخونه جی کوئری برات مینویسم؛ اگه مسئولین خواستن تاپیک رو انتقال بدن.



بر فرض مثال شما توی صفحه این کد رو داری:



<img id="myimage" src="myimage.jpg" alt="My Image" title="point me to grow my size! hahaha..." />

با فرض اینکه کتابخونه جی کوئری رو به صفحه ات اضافه کردی می تونی کد زیر رو استفاده کنی:



$(document).ready(function(){

var originHeight = $("#myimage").height(),
originWidth = $("#myimage").width(),
newHeight = 100, // your favorite height
newWidth = 200; // your favorite width

$("#myimage").bind("mouseover",function(){
$(this).css({height: newHeight, width: newWidth});
}).bind("mouseout",function(){
$(this).css({height: originHeight, width: originWidth});
});
});

البته تو این شرایط عکس فقط بزرگ و کوچیک میشه و هیچ افکت یا انیمیشنی بهش اعمال نمیشه و در ضمن صفحه ات رو هم احتمالا بهم خواهد ریخت. حالا بستگی به صفحه و css و موقعیت تصویر داره که چطور کنار بقیه عناصر باشه. باید کد صفحه ات باشه تا بتونم راجع به این مسایل نظر بدم.

jReihane
چهارشنبه 21 مهر 1389, 10:25 صبح
البته كتابخونه هاي مخصوص image processing هم وجود دارند. اكثراً هم يادگيريشون خيلي راحته.
به اين دو تا لينك يه سري بزنين بد نيست:
http://tutorialblog.org/12-javascript-image-galleries/
http://www.pixastic.com/lib/

موفق باشين

Javad_Darvish_Amiry
چهارشنبه 21 مهر 1389, 21:26 عصر
البته كتابخونه هاي مخصوص image processing هم وجود دارند.

با سلام و تشکر از راهنماییتون توضیحات ذیل را باید خدمتتون عرض کنم.
اون آدرس هایی که شما نوشتید کتابخونه ای برای کار با تصاویر یا همون به قول شما image processing نیستند، بلکه پلاگین هایی هستند که خودشون بر اساس کتابخونه هایی مثل jQuery یا MooTools یا چیزای دیگه نوشته شدن. البته این رو صرفا برای جلوگیری از تداخل مفاهیم و یادگیری اشتباه عرض کردم و امیدوارم ناراحتتون نکرده باشم.
از طرف دیگه، همیشه استفاده از پلاگین های آماده خوب نیست:
اول اینکه خیلی وقت ها کاری که اون پلاگین انجام میده با اون حجم بالای کد، میشه با یه کد ساده تر و یه خورده خلاقیت و تفکر، با حجم کد تولیدی خیلی خیلی پایین تر، انجام داد. برای نمونه من خودم یه پلاگین برای گالری تصاویر نوشتم که هم امکاناتش فوق العاده زیادتر از خیلی از گالری هاییه که من تا حالا دیدم، و هم حجمش خیلی پایین ( حدود 9 کیلو بایت رو هسته jQuery 1.2.6 با حجم حدود 29 کیلو بایت).
دوم اینکه خیلی وقت ها کارهایی که میخواهیم انجام بدیم، با چند خط کد به سادگی انجام میشه و نیاز به استفاده از یه پلاگین سنگین با امکانات اضافه نداره.
سوم این که ما کی میخواهیم تولید کننده بشیم؟ همیشه مصرف کننده؟ واقعا 4 تا خط کد JavaScript نوشتن اینقدر سخته؟ نمیگم کتابخونه بنویسم، ولی پلاگین نوشتن یا حتی از اون ساده تر استفاده از کتابخونه های آماده که دیگه کاری نداره. متاسفانه ما وقتی میرسیم اونور، فقط ظاهر قضایا رو میبینیم، یادمون باشه که اون پلاگین ها برای برنامه نویسا نیست، بلکه برای استفاده کننده هاست، وبلاگی، سایت سازی، سی ام اسی، فرانت پیج، دریم ویور،چیزی تو این مایه ها که هر آماتوری باهاش سر و کار داره. نه منِ برنامه نویس که خیر سرم قراره تولید کننده باشم.
همه اینها رو صرفا از جهت درد دل گفتم و امیدوارم به جای آینه شکستن، خودشکن باشیم و عبرت بین.
پیروز باشید و موفق.
ضمنا از Houmehre (http://barnamenevis.org/forum/member.php?u=159440) عزیز برای لطفی که در حق mahtab s (http://barnamenevis.org/forum/member.php?u=157078) عزیز کرد و سعی کرد قلاب ماهی گیری رو بده دستش ممنونم.

jReihane
چهارشنبه 21 مهر 1389, 23:50 عصر
بله،
كاملا با مطالبي كه گفتين موافقم. من هم منظورم اين نبود كه لازم نيست فكر كنين و برين از كدهاي آماده استفاده كنين... اين كتابخونه ها و پلاگين ها همگي كدباز هستند و مي تونين ازشون ايده بگيرين.
صرف دونستن وجود يه همچين مطالبي كه كشتن خلاقيت و مصرف گرايي نيست. اگر كسي به حدي رسيده كه خودش ايده مي ده و ايده اش رو پياده سازي مي كنه خب ايده يا محصول يا نمونه كارش رو ارائه بده تا همه استفاده كنن... باعث خوشحاليه
به خاطر مطلب خوبتون هم متشكرم و تاكيد مي كنم كه با شما موافقم ما بايد توليدكننده باشيم.

حرف ديگه اي ندارم. اميدوارم يه روز سري توي سرها بلند كنيم...

mahtab s
پنج شنبه 22 مهر 1389, 15:30 عصر
سلام فکر کنم اگه سوالت رو توی بخش یکی از کتابخونه ها مطرح می کردی جواب بهتری میگرفتی.
به هر حال اینجا هم مربوط به جاوا اسکریپته، من جواب رو با کتابخونه جی کوئری برات مینویسم؛ اگه مسئولین خواستن تاپیک رو انتقال بدن.

بر فرض مثال شما توی صفحه این کد رو داری:





<img id="myimage" src="myimage.jpg" alt="My Image" title="point me to grow my size! hahaha..." />





با فرض اینکه کتابخونه جی کوئری رو به صفحه ات اضافه کردی می تونی کد زیر رو استفاده کنی:







$(document).ready(function(){

var originHeight = $("#myimage").height(),

originWidth = $("#myimage").width(),

newHeight = 100, // your favorite height

newWidth = 200; // your favorite width

$("#myimage").bind("mouseover",function(){

$(this).css({height: newHeight, width: newWidth});

}).bind("mouseout",function(){

$(this).css({height: originHeight, width: originWidth});

});

});







البته تو این شرایط عکس فقط بزرگ و کوچیک میشه و هیچ افکت یا انیمیشنی بهش اعمال نمیشه و در ضمن صفحه ات رو هم احتمالا بهم خواهد ریخت. حالا بستگی به صفحه و css و موقعیت تصویر داره که چطور کنار بقیه عناصر باشه. باید کد صفحه ات باشه تا بتونم راجع به این مسایل نظر بدم.







مرسی دوست عزیزم . چند تا سوال داشتم :
من بای قرار دادن عکس توی صفحه از کد زیر استفاده میکنم :


<asp:ImageID="image1"runat=serverHeight=400pxWidth=300px/>

و اینجوری هم تصویر ور داخلش قرار میدم :


image1.ImageUrl = Convert.ToString(Session["poster"]);

یعنی از <img src استفاده نمیکنم .
تو این حالت مشکلی پیش نمیاد ؟
در ضمن کتابخونه jquery ور از کجا بیارم ؟

funpatogh
پنج شنبه 22 مهر 1389, 20:25 عصر
این کتابخانه رو میتونید از سایت رسمیش دانلود کنید
که نسخه کامل و مینی داره
http://docs.jquery.com/Downloading_jQuery

Javad_Darvish_Amiry
پنج شنبه 22 مهر 1389, 21:33 عصر
یعنی از <img src استفاده نمیکنم .
سلام دوست خوبم؛ من توی گفتارم بسیار رک و صریح هستم ولی از روی غرض نبوده و قصد کمک دارم؛ پس از منظر آموزش به قضیه نگاه کن.
اینطور که من استنباط کردم شما در یک از این دو حالت قرار داری: 1- یا خیلی تازه کار هستی. 2- یا جزو گروهی هستی که تصور کاملا ابتدایی و اشتباهی در مورد ASP.NET دارن، یعنی اون رو یک زبان مستقل فرض کرده و فکر می کنن که صفحه اونهاست که داره کاربر میبینه؛ در هر دو صورت توضیحات زیر می تونه برات راهگشا باشه، البته این مطالب شاید جاش اینجا نباشه و باید بره تو تالار مربوطه، اما به هر حال من تازه وارد هستم و مدیران سایت خودشون هر جور صلاح میدونن عمل کنن.
ببین برادر | خواهر | عزیز من! ASP.NET یه جور نشانه گذاری XML هستش. موقعی که شما برنامه ات رو کامپایل می کنی، کل صفحه ات تبدیل به کلاس های C#‎.Net ( یا بسته به مورد به یکی از زبان های دات نت مثل وی بی، بسته به این داره که زبان پروژه ات چی باشه )، میشه که البته هر چیزی هم که شما تو صفحه ات داری، تبدیل به عناصر و المان های اون صفحه میشه؛ بعد وقتی کاربر صفحه ای از سایت شما رو درخواست کرد، موتور از روی آدرس می فهمه که الان باید کدوم کلاس رو نمونه سازی کرده، پردازش ها رو انجام بده و در نهایت متد رندر از صفحه فراخونی شده و کد نهایی که چیزی جز HTML خالص نیست، تولید شده و توی استریم خروجی نوشته میشه. یعنی چی؟ یعنی آخرسر این کد HTML هستش که برای کاربر نهایی ارسال میشه.
چرا؟
چون کاربر باید صفحه رو توی مرورگر ببینه و مرورگر هم چیزی جز HTML نمیفهمه.
بنابراین شما برای طراحی سایت یا برنامه نویسی تحت وب، ناگزیر از HTML هستی.



<asp:Image ID="image1" runat="server" Height="y" Width="x" />
image1.ImageUrl = Convert.ToString(xxxx);

خوب این کد یعنی چی؟
یعنی کلاس صفحه شما، یک فیلد داره، از نوع Image با اسم image1.
حالا این نوع که گفتیم چی هست؟ (امیدوارم بدونی نوع یا همون Type چی هست؟؟؟!!!) این نوع یه کلاس نوشته شده از قبل هست، یعنی از همون هایی که بهش میگن User Defined Type یعنی نوع تعریف شده توسط کاربر، مهم نیست این کاربر کیه (اینجا کاربر میشه همون برادرای زحمتکش میکروسافت، که شبو روز جون میکنن تا ما اینجا در کمال نامردی و البته خونسردی محصولاتشون رو بدزدیم، البته اونا کارشون در راه رضای خداست، ما هم که بنده خداییم)، مهم اینه که این نوع جزو انواع خود زبان نیست، مثل کلاس ها که عموما ماها باهاش سروکار داریم؛ اینجا هم همینه، پس Image یه کلاس هستش:




namespace System.Web.UI.WebControls{
public class Image : WebControl{
public virtual string ImageUrl { get; set; };
public virtual Unit Height { get; set; };
public virtual Unit Width { get; set; }
}
}



و اون هایی که شما تنظیم کردی، میشن پراپرتی های این کلاس (که البته طول و عرض رو از کلاس WebControl ارث برده که البته اونهم خودش از Control ارث برده.
کد نهایی تولید شده برای این عضو کلاس صفحه شما، یعنی image1 میشه چیزی شبیه این:



<img src="your image1.ImageUrl property" style="height: your image1.Height property, width: your image1.Width property" id="(calculate prefix for image1)_image1" />

که ارسال میشه برای کاربر نهایی و اون میتونه ببیندش.
حالا ممکنه بگی من که برنامه ام رو کامپایل (در واقع پری کامپایل) نمیکنم ( که فکر میکنم واقعا اینطوریه) همونجوری ران میکنم یا آپلود میکنم به سرور، خوب تو اولین درخواستی که به سایتت میرسه، خود موتور اینکار رو برات انجام میده؛ تو کامپیوتر خودت هم همینه، وقتی هم کدت رو ویرایش کردی و تغییر دادی موتور می فهمه و تو اولین درخواست بعدی (همون ران کردن خودمون) یه کامپایل جدید و دوباره تا آخر. مسیر پیش فرض برای win xp برای ذخیره کامپایل شده های فوق، اینه:



C:\Windows\Microsoft.NET\Framework\v2.0.50727\Temp orary ASP.NET Files\(your project name)

البته این مسیر برای تا دات نت 3.5 که موتور همون 2 بوده هستش، (موضوع ورژن های Framework و ورژن های RunTime هم خودش یه داستان جداگانه داره) . اگه win 7 و طبیعتا دات نت 4 داشته باشی مسیر فرق میکنه.


البته این داستان طولانیه و خودت باید باید پیگیریش کنی. تا اینجا رو هم برای این که یه تلنگور بهت زده باشم تا شاید باعث حرکتت بشه، گفتم. امیدوارم از لحن تند و بی پرده ام ناراحت نشده باشی.
به نظر من توی 2 زمینه به صورت جداگانه مطالعه عمیق کن:
1- برنامه نویسی سمت Client که شامل HTML, JavaScript, CSS, XML به عنوان مهمترین و پایه مباحث، میشه.
2- برنامه نویسی سمت Server که البته گزینه های متفاوت و متنوعی پیش رو داری(بر خلاف سمت Client) که شما عجالتا ASP.NET رو انتخاب کردی، برای این گزینه مطالعه عمیق و زیر بنایی در مورد ASP.NET به عنوان لایه اول، بعدش C#‎.NET یا هر زبون دات نتی دیگه که خودت علاقه داری (حتی میتونی PHP.NET هم کار کنی ولی باید تو نت بچرخی تا پیداش کنی) به عنوان قسمت دوم فعالیت ها، و از همه این ها مهمتر خود دات نت به عنوان مهمترین موضوع سمت سرور.
بعد میتونی با انطباق این دو تا موضوع سر از کار برنامه نویسی وب در بیاری، اونوقت برنامه های ارزشمند و البته گرونقیمت بنوییسی و دستمزد تلاشت رو بگیری.
اگه هم حال داری و میخوای خیلی حرفه ای باشی، در مورد خود HTTP هم تحقیق و مطالعه کن، چون به هر حال داری برنامه نویسی وب انجام میدی و وب بدون HTTP معنی نداره.




در مورد مشکل فعلی ات هم، نه مشکلی به وجود نمیاد (که البته فکر کنم خودت متوجه شدی) اما فکر میکنم منظور Houmehre عزیز از اینکه صفحه ات به هم میخوره، بر میگرده به این که چه عناصر دیگه ای و با چه موقعیتی نسبت به تصویر مورد نظر تو صفحه داری و تصویرت برای بزرگ شدن چقدر جای فعالیت داره.
CSS بلدی؟ اگه نه حتما یاد بگیر. jQuery رو هم برات ضمیمه میکنم، ورژن 1.2.6 که خیلی سبک هست و کارت رو کامل ره میندازه.
پیروز باشید و پاینده.


آهورمزد بزرگ، نگاه بان دانش ورزان این مرز و بوم بادا!
چنین بادا!

mahtab s
پنج شنبه 22 مهر 1389, 22:22 عصر
مرسی دوست خوبم .
واقعا ازتون ممنونم که وقت گذاشتین و این مطالب رو برای آگاهی بنده نوشتین .
راستش من تازه برنامه نویسی با این زبان رو شروع کردم . توضیحاتتون دید منو خیلی عوض کرد .
بازم ممنون . :لبخندساده:

mahtab s
پنج شنبه 22 مهر 1389, 22:54 عصر
ببخشید یه سوال دیگه .
من این کارا رو کردم . یعنی کتابخونه رو اضافه کردم . کد مربوطه رو نوشتم ولی موقع اجرا java runtime error میده . کسی میدونه مشکل چیه ؟

Houmehre
پنج شنبه 22 مهر 1389, 23:03 عصر
شما اصلا با Java کاری ندارید؛ اگه ممکنه کدتون رو بذارید تو صفحه تا بتونیم کمکتون کنیم.