.net点击图片放大

<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1" runat="server">
    <title></title> 
<script type="text/javascript">
$(document).ready(function() {
//Activate FancyBox
$("p#test1 a").fancybox({
'hideOnContentClick': true
});

$("p#test2 a").fancybox({
'zoomSpeedIn': 0, 
'zoomSpeedOut': 0, 
'overlayShow': true
});

$("p#test3 a").fancybox({
'hideOnContentClick': true
});
$("p#test4 a").fancybox({
'zoomSpeedIn': 0, 
'zoomSpeedOut': 0, 
'overlayShow': true
});

$("a#custom_1").fancybox({
'itemLoadCallback': getGroupItems
});

$("a#custom_2, a#custom_3").fancybox({
'zoomSpeedIn': 0, 
'zoomSpeedOut': 0
});

$("div#donate").bind("click", function() {
$("#donate_form").submit()
});

$("#comment_form").attr("action", "/fancy/add_comment"); $("#age").val('fancy'); //die spamers, die...
});
var imageList = [
{url: "images/6_b.jpg", title: "First image"},
{url: "images/7_b.jpg", title: "Second image"},
{url: "images/8_b.jpg", title: "Third image"}
];

function getGroupItems(opts) {
jQuery.each(imageList, function(i, val) {
        opts.itemArray.push(val);
    });
}

    </script>
</head>
<body>
  <form id="form1" runat="server">
     <div id="demo">
            <table>
                <tr>
                    <td id="demo1" style="height: 61px">
                        <p id="test1">
                            <asp:DataList ID="DataList2" runat="server" RepeatDirection="Horizontal" CellPadding="0"
                                CellSpacing="0">
                                <ItemTemplate>
                                    <a href='<%# "images/"+Eval("product_img") %>'>
                                        <asp:ImageButton ID="imgbtn_pimg" runat="server" ImageUrl='<%# "images/"+Eval("product_img") %>'
                                            Height="40px" Width="40px" /></a>
                                </ItemTemplate>
                            </asp:DataList>
                        </p>
                    </td>
                    <td id="demo2" style="width: 3px; height: 61px">
                        <p id="test3">
                        </p>
                    </td>
                </tr>
            </table>
        </div>  
</form>
</body>
</html>
<script type="text/javascript" language="javascript"> 
//滚动速度 
var speeda=20 
demo2.innerHTML=demo1.innerHTML 
//从右至左 
function Marquee()
{ 
    if(demo1.offsetWidth-demo.scrollLeft<=0) 
    {
        demo.scrollLeft=0 
    }
    else 
    {
        demo.scrollLeft++ 
     }
} 
var MyMar=setInterval(Marquee,speeda) 
demo.onmouseover=function()
{
   clearInterval(MyMar)
} 
demo.onmouseout=function() 
{
   MyMar=setInterval(Marquee,speeda)
} 
</script>这个要实现的效果是图片滚动，当点击某一张时该图片放大，上面的js是图片放大的代码，底部的是图片滚动的代码，现在问题是当点击图片的时候这个页面就刷新了，而不弹出放大的图片了，请教高手！

解决方案 »

  1.   

    这个好像和.net没什么关系吧 这个是js做的事
      

  2.   

    别把 ie浏览器做的绘图工作 变成 你自己做的了
    html js 说白了就是告诉ie怎么绘图。这个和.net的关系 真没有
      

  3.   

    <link rel="stylesheet" href="../css/lightbox.css" type="text/css" media="screen" />
    <script src="../JS/prototype.js" type="text/javascript"></script>
    <script src="../JS/scriptaculous.js?load=effects" type="text/javascript"></script>
    <script src="../JS/lightbox.js" type="text/javascript"></script>
    <script src="../JS/userjng.js" type="text/javascript"></script>
    <a href="../img/<%# Eval("Pic").ToString()%>" rel="lightbox">
    <img src="../img/<%# Eval("Pic")%>" width="135" height="136" border="0" />
    </a> 
    JQUERY放大图片也可