Javascript 将调用JQuery的图像转换为iFrame调用

我刚刚购买了此模板：

除了一个小问题，它做了我需要的一切。任何jQuery专家都能告诉我，我可以如何更改调用主页上较大图像（以及其他执行相同操作的页面）的函数，以便它调用iFrame？这样我可以显示我喜欢的任何东西，而不仅仅是图像

我相当确定这是一个处理所有这些的文件，但javascript对我来说是希腊语：

因此，为了让每个人都明白，与我不同的是，他们知道自己在用jQuery做什么，我希望能够列出如下列表：

<ul class="thumbs">
    <li><a href="frames/frame1.php"><img src="images/photo/tfile_small_1_1.jpg" alt="" title=""></a></li>
</ul>

而不是我从模板复制和粘贴的当前格式：

<ul class="thumbs">
    <li><a href="images/photo/tfile_gall_1_1.jpg"><img src="images/photo/tfile_small_1_1.jpg" alt="" title=""></a></li>
</ul>

并让它显示frame1.php的内容，而不是tfile_gall_1_1.jpg等

我认为这是加载第一个图像的函数：

initGallery =
    function(){
        var $gal = $('#gallery'),
            img_link = $gal.find('.thumbs li:first-child').children('a').attr("href");

        $gal.find('.thumbs li:first-child').addClass("current").find('img').fadeTo('500', 0);

        $loading.show();

        _img=$('<img class="big_img">')
        _img.css({left:"100px", top:"30px", opacity:0}).load(
            function(){
                $loading.hide();
                $gal.prepend(this);
                $(this).animate({left:"17px", top:0, opacity:1}, 500);
            })
            .attr({src:img_link});

        $gal.children('.gallery_nav').tinycarousel({ axis: 'y'});

        $gal.find("ul.thumbs li").each(
            function(){
                var thumbUrl = $(this).find("img").attr("src");
                $(this).children().css({'background' : 'url(' + thumbUrl + ') no-repeat right top'});
            }
        );

        $gal.hover(
            function(){
                $('.gallery_nav', this).stop().animate({right:0}, 'fast')
            },
            function(){
                $('.gallery_nav', this).stop().animate({right:"-164px"}, 'fast')
            }
        );
    };

initGallery=
函数（）{
var$gal=$（“#画廊”），
img_link=$gal.find（'.thumbs li:first child'）.children（'a'）.attr（“href”）；
$gal.find（'.thumbs li:first child'）.addClass（'current'）.find（'img'）.fadeTo（'500'，0）；
$loading.show（）；
_img=$（'
这是后续图像的一个：

$mainContent.delegate("#gallery .thumbs a", "click", function(){

    if($(this).parent().is(".current")){
        return false
    }
    else {
    $(this).parent().addClass("current").find("img").css({opacity:0}).parent().parent().siblings(".current").removeClass("current").find("img").css({opacity:1});
        var img_link = $(this).attr("href");
        var $gal = $('#gallery');
        $loading.show();
        $gal.children('.big_img').animate({left:"-40px", top:"40px", opacity:0}, 500 , function(){
            $(this).remove()
        });

        _img=$('<img class="big_img">')
        _img.css({left:"100px", top:"30px", opacity:0}).load(
            function(){
                $loading.hide();
                $gal.prepend(this);
                $(this).animate({left:"17px", top:0, opacity:1}, 500);
            })
            .attr({src:img_link});

            return false;
        }
    });

$mainContent.delegate（“#gallery.thumbs a”，“click”，function（））{
如果（$（this）.parent（）是（“.current”））{
返回错误
}
否则{
$（this）.parent（）.addClass（“current”）.find（“img”）.css（{opacity:0}）.parent（）.parent（）.sides（.current”）.removeClass（“current”）.find（“img”）.css（{opacity:1}）；
var img_link=$（this.attr（“href”）；
var$gal=$（“#gallery”）；
$loading.show（）；
$gal.children（'.big_img'）。动画（{左：“-40px”，顶部：“40px”，不透明度：0}，500，函数（）{
$（this.remove（））
});
_img=$（'
但当我改变

_img=$('<img class="big_img">')

\u img=$（“”）

到

\u img=$（“”）

它拒绝生成HTML。似乎与此有关：
但我就是想不起来

提前谢谢

更新：
因此，我将问题追溯到这里：

我曾尝试将append（）函数添加到代码中，但它似乎进入了一个无限循环，生成iframe，然后再次生成它。
好的，所以解决方案是注释掉控制图像的两个摘录（在问题中列出），然后将以下内容添加到新文件中：

function loadIframe(iframeName, url) {
    var $iframe = $('#' + iframeName);
    if ($iframe.length) {
        $iframe.attr('src', url);
        return false;
    }
    return true;
 }

设置初始iframe，例如：

<iframe src="" width="630" height="420" frameborder="0" webkitAllowFullScreen mozallowfullscreen allowFullScreen name="ifrm" id="ifrm"></iframe>



然后在菜单中单击如下所示：

<ul class="thumbs">
    <li><a href="" onClick="return loadIframe('ifrm', this.href);"><img src="img/photo/" alt="" title=""></a></li>



JS文件，如果只是关于行为，而不是关于html生成。尝试搜索模板文件中生成
元素的位置。我知道在那里，上面详述的ul是复制粘贴。问题是，当我输入任何非图像的内容时，加载的图像永远不会消失。
<ul class="thumbs">
    <li><a href="" onClick="return loadIframe('ifrm', this.href);"><img src="img/photo/" alt="" title=""></a></li>