سوال: تغییر رنگ button با جاوا اسکریپت [بایگانی]

mohammadhafez

پنج شنبه 05 دی 1392, 16:06 عصر

سلام دوستان

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

مرسی

Javidhb

جمعه 06 دی 1392, 00:12 صبح

html:

<button id="btn">test</button>

js:

var btn = document.getElementById("btn"); //انتخاب دکمه

var defaultColor = btn.style.background; //گرفتن رنگ پیش فرض

btn.onmouseover = function(){
this.style.background='#000000'; //تغییر رنگ به مشکی
}

//وقتی موس از روی دکمه خارج شد
btn.onmouseleave = function(){
this.style.background=defaultColor; //برگردوندن به رنگ پیش فرض
}

انجام این کار با jquery به مراتب راحتتر خواهد بود..

mohammadhafez

جمعه 06 دی 1392, 13:23 عصر

html:

<button id="btn">test</button>
js:

var btn = document.getElementById("btn"); //انتخاب دکمه

var defaultColor = btn.style.background; //گرفتن رنگ پیش فرض

btn.onmouseover = function(){
this.style.background='#000000'; //تغییر رنگ به مشکی
}

//وقتی موس از روی دکمه خارج شد
btn.onmouseleave = function(){
this.style.background=defaultColor; //برگردوندن به رنگ پیش فرض
}

انجام این کار با jquery به مراتب راحتتر خواهد بود..

مرسی از راهنماییت دوست عزیز این کد button رو کجا بزارم؟

<button id="btn">test</button>

Javidhb

جمعه 06 دی 1392, 15:09 عصر

هر جایی بین تگ body میتونید بنویسید..

مثال کاملتر:

<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>jQuery UI Sortable - Display as grid</title>
<style>

</style>
</head>
<body>
<button id="btn">test</button>

<script>
var btn = document.getElementById("btn"); //انتخاب دکمه
var defaultColor = btn.style.background; //گرفتن رنگ پیش فرض

btn.onmouseover = function(){
this.style.background='#000000'; //تغییر رنگ به مشکی
}

//وقتی موس از روی دکمه خارج شد
btn.onmouseleave = function(){
this.style.background=defaultColor; //برگردوندن به رنگ پیش فرض
}
</script>

</body>
</html>

amirpc381

دوشنبه 29 خرداد 1396, 13:00 عصر

سلام دوستان

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

مرسی

سلام
دوست عزیز شما میتونید این کار رو با css هم انجام بدید که برای شما خیلی آسون تر هم هست!

Derak_Ali

دوشنبه 19 تیر 1396, 16:50 عصر

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

145725

برای جزئیات بیشتر میتونی از این لینک (https://www.w3schools.com/cssref/sel_hover.asp)استفاده کنی