马上,我想解释一下,我是网页设计的新手。关于这一点,我认为我遇到了一个超出我的概念技能水平的问题。
对于初学者,我已经使用以下代码成功实现了带有嵌入 youtube 视频的 colorbox:
<head>
{js}
<link rel="stylesheet" type="text/css" media="all" href="{stylesheet='in-store-analytics/testStyle'}" />
<script>
$(document).ready(function(){
$(".youtube").colorbox({iframe:true, innerWidth:435, innerHeight:344});
});
</script>
</head>
<body>
<p> <a class="youtube" href="http://www.youtube.com/embed/" title="horses">
<img src="/uploads/features/featured-block-1.jpg" /></a></p>
</body>
此代码完全按照我的意愿工作(即它会弹出视频,然后我可以通过在框外单击来关闭它。)
但是 当我尝试使用 ExpressionEngine 将此代码嵌入另一个代码块时,我遇到了新问题:当我尝试关闭弹出窗口时,背景保持不透明,因此我无法再看原网页。显然,背景中存在某些冲突,但我只是不知道冲突可能是什么。
这是围绕嵌入的代码(我用破折号标记了嵌入):
<head>
</head>
{favicon}
{global_stylesheets}
{js}
<body class="technology">
<div id="wrapper">
{embed='embed/header'}
<div id="masthead">
{embed='embed/nav'}
<div id="banner">
<div style="display:none;">
</div>
</div> <!-- END div banner -->
<br style="clear: left;" />
</div> <!-- END div masthead -->
<div id="content-main">
<div id="content-col1">
<h3></h3>
<div id="lead-sentence">
</div>
<div id="main-body{if subpage_graphic != ''}-graphic{/if}">
<h1> Hello world and welcome to my link!</h1>
------- {embed="in-store-analytics/testing2"} --------
</div> <!-- END div text-content -->
<br style="clear: both;" />
</div> <!-- END div content-col1 -->
{embed="embed/crosslinks"}
<br style="clear: both;" />
</div>
{embed="embed/footer"}
</div> <!-- END div wrapper -->
同样,当我点击链接的图片时,只出现一个黑色背景,我无法摆脱它。关于我的代码中可能存在冲突以使嵌入不再有效的任何想法或如何着手找出答案的想法?
提前致谢。
最佳答案
事实证明,我的一个嵌入正在调用 Raphael 库,这意味着该库被调用了两次。虽然我知道这不是最佳做法,但我仍然不明白为什么这会导致如此截然不同的功能。
关于javascript - colorbox 在 ExpressionEngine 嵌入中不起作用(youtube 弹出窗口),我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/12717973/