先到FancyBox下載套件
將js及css放入如圖
在/App_Start/BundleConfig.cs加入
bundles.Add(new ScriptBundle("~/bundles/fancybox").Include("~/Scripts/fancybox/jquery.fancybox.js")); bundles.Add(new StyleBundle("~/Content/fancybox").Include("~/Content/fancybox/jquery.fancybox.css"));View的部份新增兩個一個為主頁面(Index)一個為被呼叫頁面(FancyBox)
加入jQuery參考及FancyBox參考
ActionLink寫法如下
@Scripts.Render("~/bundles/fancybox") @Styles.Render("~/Content/fancybox") @Html.ActionLink("[新增]", "FancyBox", "Home", null, new { @class = "fancybox fancybox.iframe" })