شبیه سازی رویداد moseenter و moselave

[ebrahimhoze]

میخوام وقتی موس روی عنصر imagebutton رفت عکس داخل اون تغییر کنه و با خارج شدن موس به حالت اولیه برگرده

[m.hamidreza]

از طریق جاوااسکریپت میتونی انجام بدی، نمونه این رویداد ها تو جاوااسکریپت هست ...
OnmouseOver+OnmouseOut

[ebrahimhoze]

یه مثال کامل هم بزنین دیگه کاملا ممنون

[mahdi_farhani]

<script language="javascript" type="text/javascript">
function firstPicture(img)
{
img.src="01.jpg";
}
function changPicture(img)
{
img.src="02.jpg";
}
</script>



<asp:Image ID="Image1" runat="server" ImageUrl="~/01.jpg" onmouseMove="changPicture(this)" onMouseOut="firstPicture(this)" />
البته بستگی به هنر کد نویسیت و همچنین کاری که میخواهی انجام بدی این توابع تغییر میکنه

[امید امرایی]

سلام

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

جاوا اسکریپت :



<script language="javascript" type="text/javascript">

function changeImage(img,src){
img.src = src;
}

</script>
HTML:


<img border="0" src="images/sample.gif" onmouseover="changeImage(this,'images/sample2.gif')" onmouseout="changeImage(this,'images/sample.gif')">


موفق باشید

[IranVisual]

یه سوال دیگه
من تو asp.net از imagebutton استفاده کردم برای قسمت نظرات 5 تا image گزاشتم با نامهای im1,im2,im3,im4,im5 میخوام وقتی موس رفت روی im1 عکس اون به t01.gif تغییر کنه و عکس او چهار تای دیگه به im2.gif

[Lagon666]

یه سوال دیگه
من تو asp.net از imagebutton استفاده کردم برای قسمت نظرات 5 تا image گزاشتم با نامهای im1,im2,im3,im4,im5 میخوام وقتی موس رفت روی im1 عکس اون به t01.gif تغییر کنه و عکس او چهار تای دیگه به im2.gif

تگ IMG:


<IMG id="myimg" src="666.gif">


دستور جاوا برای تغییر عکس:


document.getElementById('myimg').src="777.gif";




با این راهنمایی خودت میتونی یه تابع برای کارت بنویسی.

[IranVisual]

من از imagebutton استفاده میکنم نه image این دستوری که شما گفتید مال image هستش

[Lagon666]

فکر نمی کنم زیاد فرقی داشته باشه. اگه تصویر رو با src به input میدی، فقط id اون مهمه.


<input src="i/rainbow.gif" id="myimg" width="60" height="60" alt="rainbow.gif (2273 bytes)" type="image">


اگه کد Image Button ای که میگی جور دیگه ای هست که من تا حالا ندیدم، کدش رو بنویس شاید چیزی به فکرم برسه.

[IranVisual]

این کد های asp منه با یک تابع تونستم عکس هر کدومو که موس میره روش تغییر بده ولی نمیشه عکس اون 4 تای دیگه رو تغییر دارد


<asp:ImageButton ID="im5" runat="server" CssClass="text" ImageUrl="~/ImageNekaForms/TT02.gif" onmouseover="changeimage(this,'ImageNekaForms/TT01.gif');" onmouseout="changeimage(this,'ImageNekaForms/TT02.gif')" />
<asp:ImageButton ID="im4" runat="server" CssClass="text" ImageUrl="~/ImageNekaForms/TT02.gif" onmouseover="changeimage(this,'ImageNekaForms/TT01.gif');" onmouseout="changeimage(this,'ImageNekaForms/TT02.gif')"/>
<asp:ImageButton ID="im3" runat="server" CssClass="text" ImageUrl="~/ImageNekaForms/TT02.gif" onmouseover="changeimage(this,'ImageNekaForms/TT01.gif');" onmouseout="changeimage(this,'ImageNekaForms/TT02.gif')" />
<asp:ImageButton ID="im2" runat="server" CssClass="text" ImageUrl="~/ImageNekaForms/TT02.gif" onmouseover="changeimage(this,'ImageNekaForms/TT01.gif');" onmouseout="changeimage(this,'ImageNekaForms/TT02.gif')"/>
<asp:ImageButton ID="im1" runat="server" CssClass="text" ImageUrl="~/ImageNekaForms/TT02.gif" onmouseover="changeimage(this,'ImageNekaForms/TT01.gif');" onmouseout="changeimage(this,'ImageNekaForms/TT02.gif')"

اینم تابع جاوا اسکریپت

<script language="javascript" type="text/javascript">
function changeimage(img,src){
img.src=src;
}
</script>

[Lagon666]

من با ASP آشنایی ندارم. فکر کنم بهتر باشه کدی رو که وقتی صفحه لود میشه به من بدی. یعنی Image Button ای که توی صفحه ی اصلی چاپ میشه. (منظورم کد های HTML هست)

[jaza_sa]

میخوام وقتی موس روی عنصر imagebutton رفت عکس داخل اون تغییر کنه و با خارج شدن موس به حالت اولیه برگرده

علاوه بر Javascript که دوستان اشاره کردند ، اینکار با استفاده از CSS هم امکان پذیره ، اما
ممکنه بعضی از مرورگرها این خصوصیت رو پشتیبانی نکنند :

.SearchBox
{
background-color: #C0C0C0;
border: solid 1px #A0A0A0;
}
.SearchBox:hover
{
background-color: #E0E0E0;
border: solid 1px #505050;
}
.SearchBox:focus
{
background-color: #E0E0E0;
border: solid 1px #505050;
}

[IranVisual]

علاوه بر Javascript که دوستان اشاره کردند ، اینکار با استفاده از CSS هم امکان پذیره ، اما
ممکنه بعضی از مرورگرها این خصوصیت رو پشتیبانی نکنند :

.SearchBox
{
background-color: #C0C0C0;
border: solid 1px #A0A0A0;
}
.SearchBox:hover
{
background-color: #E0E0E0;
border: solid 1px #505050;
}
.SearchBox:focus
{
background-color: #E0E0E0;
border: solid 1px #505050;
}

با این کاری که شما میگید فقز میشه عکس یکی رو عوض کرد من میخوام وقتی روی imagebutton اولی رفت عکس اون س تای دیگه هم تغییر کنه