I am learning to use JQuery and have created the following code after reading various tutorials. I still don't quite get how JQuery variables and arrays work.
Can someone point me in the right direction as to how I can print the current filename below the image and how I can rename the current file?
<HTML>
<HEAD>
<script src="jquery.js" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function(){
$('#thumbnails').hide();
// show the large version of this thumbnail
$("#thumbnails a").click(function(e){
// clear current active thumbnail
$("#imagetoedit").attr("src", this.href);
// mark this thumbnail as active
var $thumbnails = $(this).siblings().removeClass("active");
// setup next and previous buttons. we may not use previous
//but set it up in case
$(this).addClass("active");
var arrayposition = $thumbnails.index(this);
$("#next").attr("disabled", arrayposition==$thumbnails.length-1);
$("#prev").attr("disabled", arrayposition==0);
return false;
});
// next/prev buttons just click the next/prev thumb when enabled
$("#prev").click(function(){
$("#thumbnails a.active").prev().click();
});
$("#next").click(function(){
$("#thumbnails a.active").next().click();
});
// select the first thumbnail
$("#thumbnails a:first").click();
});
</script>
</HEAD>
<BODY>
<div>
<img id="imagetoedit" src="imageorg/wk1-1.jpg">
</div>
<div id="nav">
<button id="prev">Prev</button>
<button id="next">Next</button>
</div>
<div id="thumbnails">
<a href="imageorg/wk1-1.jpg"><img src="imageorg/wk1-1.jpg"></a>
<a href="imageorg/wk2-1.jpg"><img src="imageorg/wk2-1.jpg"></a>
<a href="imageorg/wk3-1.jpg"><img src="imageorg/wk3-1.jpg"></a>
</div>
</BODY>
</HTML>Thanks for any assistance.
Andrew