En realidad, no.
O te entendí mal, y tu idea no es tan excelente.
Lo de la opacidad es un lujo innecesario, pero al cambiar el tamaño gradualmente los elementos que haya al lado del desaparecido (o reaparecido) se tienen que acomodar también gradualmente. Y por sí mismos, sin ubicar sus coordenadas con un escript.
Insisto, depende muchísimo del diseño donde se vaya a aplicar. Acá hay un ejemplo elemental.
Código:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3c.org/TR/1999/REC-html401-19991224/loose.dtd">
<html>
<head>
<meta http-equiv=Content-Type content="text/html; charset=utf-8">
<title>REACOMODA.</title>
<script type="text/javascript">
var alfa, bravo, charly;
function cambia0(T){
clearTimeout(charly);
if(T!="") {
alfa = document.getElementsByTagName( "img" )[T];
bravo = (alfa.style.width != "0%") ? -1 : 1;
if(alfa.style.width == "0%") {
alfa.style.width = "1%";
}
else {
alfa.style.width = "29%";
}
}
cambia1();
}
function cambia1() {
if(alfa.style.width != "0" && alfa.style.width != "30%") {
alfa.style.width = parseInt(alfa.style.width) + (1*bravo) +"%";
document.title= alfa.style.width;
charly = setTimeout(cambia1 , 30);
}
}
</script>
<style type="text/css">
* {margin: 0; padding: 0; border-collapse: collapse; }
html {width: 100%; }
body {width: 100%; }
div {width: 90%; float: left; }
img {width: 30%; vertical-align: middle; }
select {float: left; }
</style>
</head>
<body>
<div><img src="http://imageshack.us/a/img651/6254/ultrarreciclable.jpg" title="0"><img
src="http://imageshack.us/a/img839/6245/claudioroncoli.jpg" title="1"><img
src="http://imageshack.us/a/img715/92/diegofocaccio.jpg" title="2"></div>
<div><img src="http://imageshack.us/a/img38/9316/grafiti05.jpg" title="3"><img
src="http://imageshack.us/a/img72/2886/eugeniopalmagenoves.jpg" title="4"><img
src="http://imageshack.us/a/img715/9418/grafiti04.jpg" title="5"></div>
<select onchange="cambia0(this.value)"><option value="">-</option>
<option value=0>0</option><option value=1>1</option>
<option value=2>2</option><option value=3>3</option>
<option value=4>4</option><option value=5>5</option>
</select>
</body>
</html>
El selector que está al costado permite elegir qué imágenes aparecen o desaparecen.