rippollsと呼ばれるファンシーボックスから画像やビデオをポップアップする必要があるWebアプリケーションを作成しました。ここで私の「Rippolls」がポップアップボックスに読み込まれ、ユーザーはそれらのrippollsに投票できます。私の質問は、1ページにすべてのリップポールをリストし、画像またはビデオのあるリップポールをクリックすると、ファンシーボックスとファンシーボックスcssが読み込まれることです。
私は参照しました
<script src="../../Content/Scripts/jquery.fancybox-1.3.4.pack.js" type="text/javascript"></script>
<link href="../../Content/Styles/jquery.fancybox-1.3.4.css" rel="stylesheet" type="text/css" />
_layout.cshtml内で、_RippollList.chtmlページを参照しています。_RippollList.chtmlのコードは次のとおりです。
$("a.btnVotePop@(poll.Id)").fancybox({
'onComplete' : function() {
alert('hello');
try {
FB.XFBML.parse();
twttr.widgets.load();
history.pushState({}, "@poll.Name.Trim()", "/polls/@poll.Id");
document.getElementsByTagName("title")[0].innerHTML = "@poll.Name.Trim()";
//history.replaceState({}, "title", "@poll.Name.Trim()");
//$("#rippoll_image_path").attr("content", $("#polltitle").val());
}
catch (ex) {
alert('Error parsing response.');
}
},
'onClosed' : function(){
alert("closed");
try {
history.pushState({}, "Rippoll", "/home/mypage");
document.getElementsByTagName("title")[0].innerHTML = "My Page";
$('#divDetailCont').css('display', 'none');
}
catch (ex) {
}
},
ajax : {
type : "GET"
},
'width': '560px'
});
HTML：
<div id="videoDeftImgContainer" class="videoDefultImg">
<a class="btnVotePop@(poll.Id)" href="RippollCardPopup/@(poll.Id)">
<img class="inImgSize" src="@poll.ImagePath" />
</a>
<div id="plyBtnClk" class="playBtn" onclick="">
<a class="btnVotePop@(poll.Id)" href="RippollCardPopup/@(poll.Id)">
<img src="../../Content/images/newImages/hoverPlay.png" />
</a></div></div>
スクリプト参照：
<script src="../../Content/Scripts/jquery.fancybox-1.3.4.pack.js" type="text/javascript"></script>
<link href="../../Content/Styles/jquery.fancybox-1.3.4.css" rel="stylesheet" type="text/css" />
しかし、それでも私はfancyboxとそのスタイルのないページを取得しています。
rippollにいくつかのテキスト値（例：rippoll名、rippoll質問など）を入れており、特殊文字（@％$＃{}）も含まれている可能性があるため、疑問があります。これが理由です。ファンシーボックスでrippollsを開かないでください。
これを手伝ってください。成功したコードセグメントがあれば投稿してください。