Плавная смена фото
 

Не пойму все работает нормально но есть один глюк, first получает opacity 0.11 в конце работы скрипта а должен получать 1

<div id="slider">
	<img src="img/152305.jpg" id="first_img">
	<img src="img/43064.jpg" id="second_img">
</div>
<script>
var first  = document.getElementById('first_img');
var second = document.getElementById("second_img");
var i = 10;
var q = 1;
var interval = setInterval(
function() {
	i--;
	q++;
	if(i == 0){
		clearInterval(interval);
	}
	if(i == 10) {
	second.style.opacity = "1";
	first.style.opacity = "0";
	}
	second.style.opacity = "." + i;
	if(q == 10) {
	first.style.opacity = "1";	
	}
	first.style.opacity = "." + q;
}, 3000);
</script>

строка 25

var str = '.' + 10;
alert(str + '\n' + typeof(str));

<div id="slider">
	<img src="http://javascript.ru/forum/image.php?u=19820&dateline=1334914235" id="first_img">
	<img src="http://javascript.ru/forum/image.php?u=19820&dateline=1334914235" id="second_img">
</div>
<script>
window.onload = function () {
	var first  = document.getElementById("first_img");
	var second = document.getElementById("second_img");
	var n = 1;
	var int = setInterval(function () {
		n++;
		first.style.opacity = n/10;
		second.style.opacity = '.' + (10 - n);
		if (n == 10) {
			clearInterval(int);
		}
	}, 500);
}
</script>

Просто и элегантно, благодарю, какой же говнокод я только написал.