<a> não funciona dentro de uma div id="nivo-slider"

Olá,

Tenho o seguinte codigo:

<script type="text/javascript">

 jQuery(document).ready(function ($) {
 $( "#dialog" ).dialog({
 resizable: false,
 width: 490,
 height: 230
 });
 });

 jQuery(document).ready(function ($) {
 $('#slider').nivoSlider({
 effect: '_mouseDown', // Specify sets like: 'fold,fade,sliceDown'
 slices: 1, // For slice animations
 boxCols: 1, // For box animations
 boxRows: 1, // For box animations
 animSpeed: 1000, // Slide transition speed
 pauseTime: 6000, // How long each slide will show
 startSlide: 0, // Set starting Slide (0 index)
 directionNav: false, // Next & Prev navigation
 controlNav: false, // 1,2,3... navigation
 controlNavThumbs: false, // Use thumbnails for Control Nav
 pauseOnHover: false, // Stop animation while hovering
 manualAdvance: false, // Force manual transitions
 prevText: 'Prev', // Prev directionNav text
 nextText: 'Next', // Next directionNav text
 randomStart: true, // Start on a random slide
 beforeChange: function(){}, // Triggers before a slide transition
 afterChange: function(){}, // Triggers after a slide transition
 slideshowEnd: function(){}, // Triggers after all slides have been shown
 lastSlide: function(){}, // Triggers when last slide is shown
 afterLoad: function(){} // Triggers when slider has loaded
 });
 });

 </script>

<div id="dialog" title="Informação">
 <div id="slider" class="nivoSlider">
 <a href="[http://google.com.br](http://google.com.br)"><img src="image1.jpg"/></a>
 <a href="[http://google.com.br](http://google.com.br)"><img src="image2.jpg"/></a>
 </div>
 </div>

Funcionamento OK. O que acontece é o seguinte a imagem não pega o link, fica sem ação nenhuma, ficam apenas alternando entre uma e outra sem link nenhum para clicar. Obs: Utilizo Wordpress. Se alguem souber alguma coisa a respeito, agradeço. Obrigado.