Designik,
перепишите код на window.setTimeout вместо setInterval
или такой вариант ...
<!DOCTYPE HTML>
<html>
<head>
<title>Untitled</title>
<meta charset="utf-8">
<style type="text/css">
.BRAVEslider li:nth-child(n+2){
display: none;
}
</style>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<script>
$(function () {
var slideSpeed = 700;
var phase = 2E3;
var elWrap = $(".BRAVEslider"),
el = elWrap.find("li"),
indexImg = 0,
indexMax = el.length;
function change() {
el.eq(indexImg).delay(phase).fadeOut(slideSpeed, function () {
indexImg = ++indexImg % indexMax;
el.eq(indexImg).fadeIn(slideSpeed, change)
})
}
elWrap.mouseenter(function () {
el.eq(indexImg).stop(true)
});
elWrap.mouseleave(function () {
change()
});
change()
});
</script>
</head>
<body>
<ul class="BRAVEslider">
<li>1</li><li>2</li><li>3</li><li>4</li>
</ul>
</body>
</html>