음...크게 별다른건 없는것 같은데요,.,.?
그림 클릭했을 때 새창으로 페이징띄워주는건 게시글 번호넘겨서 db에서 긁어서 뿌리면 되고..
이미지 1장으로 mouse on/over 효과는 스쿨에도 올라와있는 팁입니다.  번거로워서 잘 사용하고 않구요..
사용할려면 아래 스크립트로 간단히 구현가능하구요..
슬라이드 부분은 코딩좀 해야겠네요..^^;
페이징부분은 제가 만들어서 사용하는거 캡쳐해서 올릴려니 댓글이라 안되네요..
블렌딩부분은 filter,Transition, Duration 을 적절히 사용할면 되고...
그누보드 갤러리에 연동하는것도 별로 어려운건 없어 보입니다.  단지 파일추가 필드를 맥시멈으로 몇개까지 하느냐에 따라 필드좀 추가해주면 되고...

음..잠깐 들어왔다가 주절주절 늘어놓기만 하고 가네요..ㅡㅡ;

<script>
// overmode 값
//    없으면 일반적인 롤오버
//    gray_color : 흑백상태에서 오버하면 칼라로. 원본이미지가 칼라일 것.
//    color_gray : 칼라상태에서 오버하면 흑백으로. 원본이미지가 칼라일 것.
//    overlay : 서로 겹쳐지며 변환
// oversrc : 변환될 이미지의 URL
var gony_rollover_preImage = new Array;

function gony_rollover(){
        var i, len = document.images.length;
        var obj, overmode, oversrc;
       
        for(i = 0; i < len; i++){
                obj = document.images[i];
                overmode = obj.getAttribute('overmode');
                oversrc = obj.getAttribute('oversrc');

                switch(overmode){
                        case 'gray_color':
                                obj.style.filter = 'gray';
                                obj.onmouseover = new Function("this.style.filter=''");
                                obj.onmouseout = new Function("this.style.filter='gray'");
                                break;
                        case 'color_gray':
                                obj.onmouseover = new Function("this.style.filter='gray'");
                                obj.onmouseout = new Function("this.style.filter=''");
                                break;
                        case 'overlay':
                                if(oversrc){
                                        obj.style.filter = "blendTrans(duration=1)";
                                        obj.onmouseover = new Function("this.filters.blendTrans.Apply(); this.src='"+oversrc+"'; this.filters.blendTrans.Play()");
                                        obj.onmouseout = new Function("this.filters.blendTrans.Apply(); this.src='"+obj.src+"'; this.filters.blendTrans.Play()");
                                        gony_rollover_preImage[gony_rollover_preImage.length] = oversrc;
                                }
                                break;
                        default:
                                if(oversrc){
                                        obj.onmouseover = new Function("this.src='"+oversrc+"'");
                                        obj.onmouseout = new Function("this.src='"+obj.src+"'");
                                        gony_rollover_preImage[gony_rollover_preImage.length] = oversrc;
                                }
                }
        }
        gony_preload();
}
function gony_preload(){
        var i, len = gony_rollover_preImage.length;
        var image_object = new Image;

        for(i = 0; i < len; i++) image_object.src = gony_rollover_preImage[i];
}

window.onload = gony_rollover;
</script>