Fancy Box not working and when click on an image it'll opens in new html page

Question

This is the code. I retreve Image from database and when click on image I want to display in a fancy box. But in given code it will not happen. I cannot find where I made wrong.

<script src="~/Scripts/jquery-2.1.4.min.js"></script>
<script src="~/Scripts/jquery.mousewheel-3.0.6.pack.js"></script>
<script src="~/Scripts/jquery.fancybox.js"></script>
<link href="~/Content/jquery.fancybox.css" rel="stylesheet" />
<link href="~/Scripts/jquery.fancybox.css" rel="stylesheet" media="screen" />

<script type="text/javascript">
$(document).ready(function () {
    $("#ShowImage").fancybox({
        helpers:
        {
            title:
            {
                type: 'float'
            }
        }
    });
});
</script>

<style type="text/css">
.imgBox {
    width: 200px;
    height: 200px;
    opacity: 1.0;
    filter: alpha(opacity=100);
}

.imgBox:hover {
        -moz-box-shadow: 0 0 10px #ccc;
        -webkit-box-shadow: 0 0 10px #ccc;
        box-shadow: 0 0 10px #ccc;
        opacity: 0.4;
        filter: alpha(opacity=40);
}
</style>

//Load image from model

    <td>
    <div class="row-fluid">
        <div class="span2">
            <div class="item">
                <div style=" margin:10px; float:left; height:200px; overflow:hidden; width:200px;">
                    <a id="ShowImage" class="fancybox-button" data-rel="fancybox-button"
                       title="Photo" href="~/File?id=@Model.Files.First(f => f.FileType == SmartJob.Domain.Models.ProfessionCourseModels.FileType.Avatar).FileId">
                        <div class="zoo">
                            <img src="~/File?id=@Model.Files.First(f => f.FileType == SmartJob.Domain.Models.ProfessionCourseModels.FileType.Avatar).FileId" class="imgBox" />
                            <div class="zoom-icon"></div>
                        </div>
                    </a>
                </div>
            </div>
        </div>
    </div>

</td>

In above code image is display, when click on image it will open in a new page. It doesn't apply Fancy Box. Where I made wrong? help please.