PDA

Просмотр полной версии : Jc, показ картинок (подмена при нажатии)


rcc0023
20.08.2009, 21:46
<p><div id="fsScreen" style="background-image: url(realtyfiles/27_1.gif);">Фотографии</div>
</p><b id="fsLinks"><a onclick="return Show_picture( 'realtyfiles/27_1.gif', 200, 200 )"><a href="realtyfiles/27_2.gif" onclick="return Show_picture( 'realtyfiles/27_1.gif', 200, 200 )"><img style="width:60px;" src="realtyfiles/27_1.gif" alt="1" border="0" /></a></a>&nbsp;<a href="realtyfiles/27_2.gif" onclick="return Show_picture( 'realtyfiles/27_2.gif', 400, 400 )"><img style="width:60px;" src="realtyfiles/27_2.gif" alt="1" border="0" /></a><a href="realtyfiles/27_3.gif" onclick="return Show_picture( 'realtyfiles/27_3.gif', 350, 350 )"><img style="width:60px;" src="realtyfiles/27_3.gif" alt="1" border="0" /></a><a href="realtyfiles/27_4.gif" onclick="return Show_picture( 'realtyfiles/27_4.gif', 1500, 1500 )"><img style="width:60px;" src="realtyfiles/27_4.gif" alt="1" border="0" /></a></b></div>

<script type="text/javascript">
function Filmstrip(){
this.ePicture = document.getElementById('fsScreen');
var eLinks = document.getElementById('fsLinks');
this.aeLink = eLinks.getElementsByTagName('A');
this.aeImg = eLinks.getElementsByTagName('img');
this.show_picture = function( sBackground, iWidth, iHeight ){
this.ePicture.style.backgroundImage = "url(" + sBackground + ")";
if( iWidth )
this.ePicture.style.width = iWidth;
if( iHeight )
this.ePicture.style.height = iHeight;
this.set_current( sBackground );

}
this.set_current = function( sHref ){

for( var i = 1 ; i < this.aeLink.length+1 ; i++ ){

if( this.aeLink[i].href.match( new RegExp( sHref + "$" ) ) ){
this.aeImg[i].style.border = "2px solid #f7ead2";

}else{
this.aeImg[i].style.border = "";return false;
}
}

}

}
var oFilmstrip = new Filmstrip();
function Show_picture( sHref, iWidth, iHeight ){
oFilmstrip.show_picture( sHref, iWidth, iHeight );
return false;
}
oFilmstrip.aeLink[0].onclick();
</script>

плохой пример реализации, чтобы было видно что старался..

Как сделать изменение в src?

<img src=""> <= если будет так

rcc0023
20.08.2009, 21:56
то есть <img id="full" src="papka/1.jpg">

нужно по функции: onclick другой ссылки изменить содержание src

diGriz
20.08.2009, 22:38
<script type="text/javascript">

$(function() {
$('#myLink').click(function() {
$("img").attr({
src: "two.jpg",
});
});
});

</script>
<a href="#" id="myLink">Click</a>
<img src="one.jpg" id="full"/>

scrat
20.08.2009, 22:55
ну или getElementById("image").SetAttribute("src","value"); или как-то так.

rcc0023
20.08.2009, 23:30
Спасибо!