Javidhb
چهارشنبه 29 آبان 1392, 21:09 عصر
چندتا مورد:
1. id (#) باید برای هر element منحصربه فرد باشه (یعنی دو تا المنت با id مشابه نمیتونی بزاری)
برای اینکاری که شما میخای بکنی باید از class (.) استفاده کنی.
2. برای لود شودن سریعتر صفحه بهتر که اسکریپتها رو پایین صفحه قبل از <body/> بنویسی.
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>home</title>
<style>
#a{
border:#9C3 solid 1px;
border-radius:10px;
margin: 4px;
padding:10px;
}
.imgClass {
background-image: url(Untitled-1.jpg);
background-repeat: no-repeat;
background-position: left top;
width: 50px;
height: 50px;
border: 0px;
cursor: pointer;
}
/*.imgClass:hover{
background-position: 0px -52px;
}
.imgClass:active{
background-position: 0px -104px;
}
*/
</style>
</head>
<body>
<!-- باید از کلاس استفاده کنید -->
<p class="a">Hello<input type="submit" class="imgClass" value="" style="margin-left:1250px" /></p>
<p class="a">salam<input type="submit" class="imgClass" value="" style="margin-left:1250px" /></p>
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript">
$(document).ready(function() {
//target => کلاس المنتی که میخای افکت رو بهشت بدی
// توی مثالتون میهش => '.a'
function faraz(target){
$(target).mouseover(function(){$(this).css('backgr ound-color','#CC0')});
$(target).mouseout(function(){$(this).css('backgro und-color','#FFF')});
$( target+" input[type='button']" ).click(function() {
//$(this) => به المنتی که کلیک رو صدا زده اشاره میکنه که همون دکمه هست
// parent(target) => به والد دکمه که دارای کلاس ی که تابع رو باهاش صدا زدی اشاره دار
$(this).parent(target).remove();
});
}
faraz('.a');
});
</script>
</body>
</html>