السلام عليكم و رحمه الله و بركاته
اثناء العمل في تصميم صفحه ويب ظهرت لي مشكله ان الصوره بعد ما قمت بعمل crop لها باستخدام الفوتوشوب
بيظهر خلفتها بيضاء في صفحه الويب
ولكن انا اريد ان تظهر الصوره فقط
وهذه صوره توضح ما اقصده

<html>
<head>
<link href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/themes/base/jquery-ui.css" rel="stylesheet" type="text/css"/>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.5/jquery.min.js"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/jquery-ui.min.js"></script>
<title>Show hide using jQuery</title>
<style>
#red{
height: 100px;
width: 100px ;
background-color: red ;
}
button{
margin-left: 100px ;
margin-top: 200px;
}
#crop{
margin-left:400px ;
margin-top : 500px ;
background-image: url('m.jpg') ;
height : 500px ;
width: 500px ;
background-color: red ;
overflow: visible ;
}
body{
background-color: red ;
}
</style>
<script type="text/javascript">
var isHide = false ;
$(function(){
$("button").button();
$("button").click(function(){
if(isHide==false)
{
$("#red").hide() ;
isHide=true ;
}
else
{
$("#red").show() ;
isHide=false ;
}
}
);
});
</script>
</head>
<body>
<div id="red">Red</div>
<button>Click Here</button>
<div id="crop">
</div>
</body>
</html>