PDA

View Full Version : سوال: CSS مربوط به Mouse Hover شيء DIV



Feremerz
جمعه 06 دی 1387, 15:22 عصر
سلام

ميخوساتم بدونم توي Visual Studio چه CSS بايد بنويسم كه مثلا وقتي موس روي شيء DIV رفت بر فرض تصوير زمينه اون عوض بشه.

اگر ميشه همراه با يك مثال توضيح بديد چون من با يك فايل HTML و اتايل دروني تونستم اين كار رو بكنم اما با CSS خارجي نشد.

اين فايل HTML:




<html>
<head>

<title>FARA</title>

<link href="StyleSheet.css" rel="stylesheet" type="text/css" />
</head>

<body>
<div align="center">

<div id="ini"/>
</div>
</body>
</html>



و اين فايل CSS:



#ini{
width:300px;
height:300px;
border:2px black solid;
}
#ini:hover{
border:2px blue solid;
}
#ini:focus{
background-color:#005588;
color:white;
}


اما توي Visual Studio ظاهرا بايد يه جور ديگه نوشته بشه
چون با اين CSS كار نميكنه

لطفا منو راهنمايي كنيد

با تشكر

emad_67
جمعه 06 دی 1387, 15:59 عصر
باید اینجوری بنویسی:


#ini:hover{
border:2px blue solid;
background-image: url("...");
}
این مورد توی ie کار نمیکنه چون ie کلاس کاذب hover رو فقط برای تگ a میشناسه و شما باید از جاوا اسکریپت برای این مورد استفاده کنی.

eAmin
جمعه 06 دی 1387, 16:19 عصر
باید اینجوری بنویسی:


#ini:hover{
border:2px blue solid;
background-image: url("...");
}
این مورد توی ie کار نمیکنه چون ie کلاس کاذب hover رو فقط برای تگ a میشناسه و شما باید از جاوا اسکریپت برای این مورد استفاده کنی.
البته میشه از تگ a برای گول زدن ie استفاده کرد، و نیازی به جاوااسکریپت هم نداشته باشیم.

emad_67
جمعه 06 دی 1387, 16:25 عصر
البته میشه از تگ a برای گول زدن ie استفاده کرد، و نیازی به جاوااسکریپت هم نداشته باشیم.
درسته ولی اون موقع دیگه با رفتن موس روی اون علامت دست ظاهر میشه که اگر نخوایم همچین چیزی داشته باشیم زیاد مناسب نیست. البته یه اسکریپتی هم وجود داره مه میشه با ضمیمه کردن اون به فایلمون کاری کنیم که ie هم hover رو برای همه تگ ها بشناسه که اونم به صورت درونی از java script استفاده می کنه.
اگر خواستین بگین ضمیمه کنم.

eAmin
جمعه 06 دی 1387, 16:55 عصر
درسته ولی اون موقع دیگه با رفتن موس روی اون علامت دست ظاهر میشه که اگر نخوایم همچین چیزی داشته باشیم زیاد مناسب نیست. البته یه اسکریپتی هم وجود داره مه میشه با ضمیمه کردن اون به فایلمون کاری کنیم که ie هم hover رو برای همه تگ ها بشناسه که اونم به صورت درونی از java script استفاده می کنه.
اگر خواستین بگین ضمیمه کنم.
css رو دسته کم نگیرید!

cursor:default;
بله اون اسکریپت هم با استفاده از behavior ( یکی از خصیصه های css که فقط در ie پشتیبانی می شه و استاندارد هم نیست ) اینکار رو می کنه، ولی همونطور که خودتون هم گفتید، از جاوااسکریپت استفاده می کنه.

Feremerz
جمعه 06 دی 1387, 17:37 عصر
نه ظاهرا منظور من رو متوجه نشديد

من اين كد رو توي ويژوال استاديو اجرا ميكنم عمل نميكنه
يعني وقتي موس رو روي تگ div ميبرم هيچ فرقي نميكنه .
در صورتي كه همين فايل با HTML كار ميكنه يعني اون كد html رو توي يه فايل .html و اون Css رو توي فايل css با نام stylesheets.css كه ميريزم جواب ميده


من ميگم چرا اينوقتي اين كد رو توي asp.net اجرا ميكنم كار نميكنه

من فايل پروژه Asp رو براتون ميزارم تا كاملا منظورم رو متوجه بشيد .

Feremerz
جمعه 06 دی 1387, 17:52 عصر
دوستان مشكل رو متوجه شدم

همونطور كه شما هم گفتيد با IE مشكل داره و وقتي من توي Firefox اجرا كردم ديدم اجرا ميشه

اما چاره چيه به نظر شما و اينكه چرا وقتي همين كد ها تو فايل HTML گذاشته ميشن مشكل ندارن و با Asp مشكل دارن

emad_67
جمعه 06 دی 1387, 19:01 عصر
دوستان مشكل رو متوجه شدم

همونطور كه شما هم گفتيد با IE مشكل داره و وقتي من توي Firefox اجرا كردم ديدم اجرا ميشه

اما چاره چيه به نظر شما و اينكه چرا وقتي همين كد ها تو فايل HTML گذاشته ميشن مشكل ندارن و با Asp مشكل دارن
برای من که مشکلی نداشت، حتی توی ie هم که انتظار نداشتم درست کار کنه، کار کرد. البته باید doctype رو تو صفحه داشته باشین. اینو الان ببین درست کار میکنه؟:


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
<title>New Page 1</title>
<style type="text/css">
#content
{
text-align: center;
}
#content:hover
{
background-color: red;
}
</style>
</head>

<body>
<div id="content">
gggg
</div>
</body>

</html>

برای من هم تو ie و هم ff کار کرد.

Feremerz
شنبه 07 دی 1387, 18:29 عصر
emad_67 عزيز

اين كدهارو اگه تو فايل html كپي كنيم كار ميكنه( اين رو قبلا خودم هم گفته بودم)
اما من ميگم توي asp كار نميكنه

اون پروژه كه گذاشتم كاملا نشون ميده

emad_67
شنبه 07 دی 1387, 19:26 عصر
اين كدهارو اگه تو فايل html كپي كنيم كار ميكنه( اين رو قبلا خودم هم گفته بودم)
اما من ميگم توي asp كار نميكنه

اون پروژه كه گذاشتم كاملا نشون ميدهخوب منم همون پروژه شما رو اجرا کردم و درست کار کرد!!

Feremerz
یک شنبه 08 دی 1387, 10:41 صبح
پس چجوريه كه با IE من مشكل داره !!!!

khz-web1
چهارشنبه 09 بهمن 1387, 11:37 صبح
نه ظاهرا منظور من رو متوجه نشديد

من اين كد رو توي ويژوال استاديو اجرا ميكنم عمل نميكنه
يعني وقتي موس رو روي تگ div ميبرم هيچ فرقي نميكنه .
در صورتي كه همين فايل با HTML كار ميكنه يعني اون كد html رو توي يه فايل .html و اون Css رو توي فايل css با نام stylesheets.css كه ميريزم جواب ميده


من ميگم چرا اينوقتي اين كد رو توي asp.net اجرا ميكنم كار نميكنه

من فايل پروژه Asp رو براتون ميزارم تا كاملا منظورم رو متوجه بشيد .
من پروژه شما رو تست کردم مشکلی نداشت...!!!!!!