Thanks - I have shown below the code, including an alternative use of imgsizer plugin. I really need to use phpthumb though as imgsizer doesn’t do everything I need. Page is at
http://vickycrowe.webfactional.com/index.php/gallery/works
and code is -
{preload_replace:my_channel="works"}
{preload_replace:my_template_group="gallery"}
{preload_replace:my_single_entry_template="works"}
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html >
<head>
<meta http-equiv="Content-Type" c charset=UTF-8" />
<title>Victoria Crowe</title>
<style>
body { font:12px arial,sans-serif;}
</style>
<link rel="stylesheet" type="text/css" href="/resources/colorbox/colorbox.css" />
[removed][removed]
[removed]
// Load jQuery
google.load("jquery", "1");
[removed]
[removed][removed]
[removed][removed]
[removed]
$(document).ready(function(){
//Examples of how to assign the Colorbox event to elements
$(".group1").colorbox({rel:'group1'});
$(".group2").colorbox({rel:'group2', transition:"fade"});
$(".group3").colorbox({rel:'group3', transition:"none", width:"75%", height:"75%"});
$(".group4").colorbox({rel:'group4', slideshow:true});
$(".ajax").colorbox();
$(".youtube").colorbox({iframe:true, innerWidth:425, innerHeight:344});
$(".vimeo").colorbox({iframe:true, innerWidth:500, innerHeight:409});
$(".iframe").colorbox({iframe:true, width:"80%", height:"80%"});
$(".inline").colorbox({inline:true, width:"50%"});
$(".callbacks").colorbox({
onOpen:function(){ alert('onOpen: colorbox is about to open'); },
onLoad:function(){ alert('onLoad: colorbox has started to load the targeted content'); },
onComplete:function(){ alert('onComplete: colorbox has displayed the loaded content'); },
onCleanup:function(){ alert('onCleanup: colorbox has begun the close process'); },
onClosed:function(){ alert('onClosed: colorbox has completely closed'); }
});
$('.non-retina').colorbox({rel:'group5', transition:'none'})
$('.retina').colorbox({rel:'group5', transition:'none', retinaImage:true, retinaUrl:true});
//Example of preserving a JavaScript event for inline calls.
$("#click").click(function(){
$('#click').css({"background-color":"#f00", "color":"#fff", "cursor":"inherit"}).text("Open this window again and this message will still be here.");
return false;
});
});
[removed]
</head>
<body>
<div id="content">
{exp:channel:entries channel="works" category="5" }
<div class="image">
imgsizer code
<a href="http://{work_image}%22class=%27group1" title="{title}" class='group1'>{exp:imgsizer:size src="{work_image}" height="200" width="200" alt="{title}"}</a>
phpthumb code
/resources/phpthumb/phpThumb.php?src={works_image}&w=200
</div>
{/exp:channel:entries}
</div>
</body>
</html>
Thanks for any help