wreder,
callback строка 88
<!DOCTYPE HTML>
<head>
<meta charset="utf-8">
<script src="http://code.jquery.com/jquery-latest.js"></script>
<style type="text/css">
.simlpe {
height: 110px;
width: 80px;
border: 1px solid #FFF;
overflow:hidden;
}
.text {
color: #000;
float: left;
}
</style>
<script type="text/javascript">
$(document).ready(function()
{
$(document).on('mouseenter', '.simlpe', function(event)
{// наведение исправил
$(this).css(
{
'width': '110px',
'borderTop': '1px solid #FF0000',
'borderBottom': '1px solid #FF0000',
'borderLeft': '1px solid #FF0000',
'borderRight': '1px solid #FF0000'
}
);
$(this).children('.text').css(
{
'color': '#FF0000'
}
);
}
);
$(document).on('mouseleave', '.simlpe', function(event)
{// наведение исправил
$(this).css(
{
'width': '',
'borderTop': '',
'borderBottom': '',
'borderLeft': '',
'borderRight': ''
}
);
$(this).children('.text').css(
{
'color': ''
}
);
}
);
$('.simlpe').click(function(event)
{// событие для клика
$(this).removeClass('simlpe');
$(this).animate(
{
'width': '336px',
'height': '110px'
}, 'slow'
);
$(this).children('.text').css(
{
'float': 'right'
}
);
event.stopPropagation();
}
);
$(document).click(function(e)
{// для сворачивания блока в исходное при нажатии за границу элемента
var target = $(e.target).filter('.one');
if (target.length != 1) {
$('.one').animate(
{
'width': '80px',
'height': '110px'
}, 'slow', function ()
{
$(this).css(
{
'borderTop': '',
'borderBottom': '',
'borderLeft': '',
'borderRight': ''
}
)
.addClass('simlpe')
.children('.text').css(
{
'float': '',
'color': ''
}
);
}
)
};
}
);
}
);
</script>
</head>
<body>
<div class="simlpe one">
<img src="http://javascript.ru/forum/images/ca_serenity/misc/logo.gif"/>
<nobr class="text">Центральный Javascript-ресурс</nobr>
</div>
</body>