超大 JavaScript 滑块添加说明答案

【问题标题】：Supersized JavaScript slider add description超大 JavaScript 滑块添加说明
【发布时间】：2012-08-07 17:15:05
【问题描述】：

我在超大滑块中添加了描述。它可以工作，但是当我检查代码时，包含描述的 div 是空的。

在 index.html 中：

        <div id="slidedescription"></div>
        ....


        slides : [ // Slideshow Images
        {image : 'img1.jpg', description : '<div"><ul><li><a href="">Text</a></li></ul></div>', title : '<h3>Text</h3>', thumb : 'img1Thumb.jpg', thumbTitle : 'Text'},
        {image : 'img2.jpg', description : '<div><ul><li><a href="">Text</a></li></ul></div>', title : '<h3>Text</h3>', thumb : 'img2Thumb.jpg', thumbTitle : 'Text'}, 
        {image : 'img3.jpg', description : '<div><ul><li><a href="">Text</a></li></ul></div>', title : '<h3>Text</h3>', thumb : 'img3Thumb.jpg', thumbTitle : 'Text'}
       ]
         });
        });

在 supersized.shutter.min.js 中：

          afterAnimation:function(){...

          if(a(vars.slide_description).length){
(api.getField("description"))?a(vars.slide_description).html(api.getField("description")):a(vars.slide_description).html("")
           }

           a.supersized.themeVars={ ...
           slide_description:"#slidedescription",

问题是：我希望输出在 HTML 页面结果中的 div 元素中，但现在：

         <div id="slidedescription"> </div>

是空的，我希望结果是：

        <div id="slidedescription">
        <div ><ul><li><a href="">Text</a></li></div>
        <div ><ul><li><a href="">Text</a></li></div>
        <div ><ul><li><a href="">Text</a></li></div>
        </div>

有可能实现吗？我想是的，但你能帮我解决这个问题吗？

最好的问候。

【问题讨论】：

标签： javascript slider supersized

【解决方案1】：

您应该将以下代码的适当部分添加到theme\supersized.shutter：

afterAnimation : function(){
        if (api.options.progress_bar && !vars.is_paused) theme.progressBar();
        var description = api.getField("description");
        if (typeof description != 'undefined') {
            $('#slidedescription').html(description);
        } else {
            $('#slidedescription').html('');
        }
    },

请注意，您可能还需要从

编辑文件 demo.html 中的路径

<script type="text/javascript" src="theme/supersized.shutter.min.js"> </ script>

到

<script type="text/javascript" src="theme/supersized.shutter.js"> </ script>

另外，您应该将上面的部分代码添加到“_init: function ()”中，该描述是在运行画廊后看到的。

【讨论】：

感谢您的回答。我试过这个，但它不适合我。你试过了吗？在 demo.html 的页面源中，slidedescription div 仍然是空的。
是的，我试过了。此解决方案正常工作。如果你运行demo.html，你需要改变幻灯片，因为第一张幻灯片的'div'是空的（你必须完成'_init:function()'）。确保您正在查看呈现的代码。我推荐萤火虫。另见：xinotes.org/notes/note/605
是的。查看呈现的代码时，它可以工作。问题是 googlebot 将如何看到它。我会把它看作一个空标签。
你可以试试这个：smart-it-consulting.com/internet/google/googlebot-spoofer/…
我已经做到了。显示标签为空。不确定这个工具有多可靠。

【解决方案2】：

你的意思是这样的吗？如果有帮助，请查看源代码：http://www.krijnen.com/opcafe.shtml

【讨论】：

您必须披露与外部链接的隶属关系。
链接到外部站点并说“查看源代码”没有帮助。如果是您的，请在您的答案中添加代码示例。