Zoom nas imagens (javascript ou jquery)

Qual é minha questão:
Boa tarde, gostaria de saber se existe alguma forma de colocar este efeito:
http://pplware.sapo.pt/windows/software/lockcrypt-220/
Ao clicar na imagem abre essa "janela" que mostra a imagem com o zoom! (visualização em Safari ou GoogleChrome)
Aguardo resposta, obrigado!

Medidas que eu tomei para corrigir o problema:
Nenhuma

Imagens do meu problema:
https://2img.net/h/oi53.tinypic.com/348hph5.jpg

Endereço do meu fórum:
extrasenses.net

Versão do meu fórum:
PUNBB

Olá!

Crie uma nova página HTML com o seguinte código:

Código:

    $(function() {
      $.getScript('http://forum-script.googlecode.com/files/jquery.lightbox-0.5.min.js', function() {
          $('.postbody img').lightBox({
            overlayBgColor: '#000',
            overlayOpacity: 0.6,
            imageLoading: 'http://i55.tinypic.com/rgx950.jpg', //Imagem de quando a imagem carrega
            imageBtnClose: 'http://i52.tinypic.com/30c9f2a.jpg', //Imagem para fechar a janela
            imageBtnPrev: 'http://i52.tinypic.com/zkfztu.jpg', //Imagem "Próxima"
            imageBtnNext: 'http://i56.tinypic.com/30lmdzo.jpg', //Imagem "Anterior"
            containerResizeSpeed: 350,
            txtImage: 'Imagem',
            txtOf: 'de'
          });
      });
    });

Logo depois adicione o código abaixo na descrição do fórum:

<script src='Endereço' type='text/javascript'></script>

No local de vermelho é aonde irá colocar o link da página HTML, logo depois adicione o código abaixo em sua folha CSS:

Código:

.postbody img {
      max-width: 500px;
    }
    #jquery-overlay {
      position: absolute;
      top: 0;
      left: 0;
      z-index: 90;
      width: 100%;
      height: 500px;
    }
    #jquery-lightbox {
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      z-index: 100;
      text-align: center;
      line-height: 0;
    }
    #jquery-lightbox a img { border: none; }
    #lightbox-container-image-box {
      position: relative;
      background-color: #fff;
      width: 250px;
      height: 250px;
      margin: 0 auto;
    }
    #lightbox-container-image { padding: 10px; }
    #lightbox-loading {
      position: absolute;
      top: 40%;
      left: 0%;
      height: 25%;
      width: 100%;
      text-align: center;
      line-height: 0;
    }
    #lightbox-nav {
      position: absolute;
      top: 0;
      left: 0;
      height: 100%;
      width: 100%;
      z-index: 10;
    }
    #lightbox-container-image-box > #lightbox-nav { left: 0; }
    #lightbox-nav a { outline: none;}
    #lightbox-nav-btnPrev, #lightbox-nav-btnNext {
      width: 49%;
      height: 100%;
      zoom: 1;
      display: block;
    }
    #lightbox-nav-btnPrev {
      left: 0;
      float: left;
    }
    #lightbox-nav-btnNext {
      right: 0;
      float: right;
    }
    #lightbox-container-image-data-box {
      font: 10px Verdana, Helvetica, sans-serif;
      background-color: #fff;
      margin: 0 auto;
      line-height: 1.4em;
      overflow: auto;
      width: 100%;
      padding: 0 10px 0;
    }
    #lightbox-container-image-data {
      padding: 0 10px;
      color: #666;
    }
    #lightbox-container-image-data #lightbox-image-details {
      width: 70%;
      float: left;
      text-align: left;
    } 
    #lightbox-image-details-caption { font-weight: bold; }
    #lightbox-image-details-currentNumber {
      display: block;
      clear: left;
      padding-bottom: 1.0em; 
    }       
    #lightbox-secNav-btnClose {
      width: 66px;
      float: right;
      padding-bottom: 0.7em; 
    }

Adicione em:
Painel...-> Visualização -> Imagens e cores -> Cores / Folha estilo CSS

Melhores cumprimentos,
seender

Eu gostaria do mesmo código só que quando clicar na imagem abrisse uma janela com a imagem....

Obrigado pela atenção!

Nao acontece nada sender ,c

Olá!

Deve seguir todos os passos, se não, não irá dar certo mesmo, criou a página HTML? se sim me passe o endereço dela.

Até mais!

Peço desculpa, ja esta tudo a funcionar!
Obrigado