Question

非常好的api，干净且易于使用。

问题，如何制作，以便我可以在标题栏中包含操作项？我想添加一些按钮，例如删除图像的功能等。

我尝试将滑块高度设置为300，图片@ 250和标题@ 50，但幻灯片属性上的overflow: hidden，它会隐藏标题栏。

更新

RedactorPlugins._imageManager = function()
{
return {

    renderImages: function(\$el, payload)
    {
        var html = '';

        html += '<div id="slider-1-wrap" style="position: relative; top: 0px; left: 0px; margin: auto; width: 600px; height: 300px;">';
        html += '    <div u="slides" style="cursor: move; position: absolute; left: 0px; to; width: 600px; height: 300px; overflow:hidden;">';
        html += '        <div>';
        html += '            <img src="http://www.engraversnetwork.com/files/placeholder.jpg" style="position: absolute; top: 0px; left: 0px; width: 600px; height: 250px;" />';
        html += '            <div style="position: absolute; top: 250px; left: 0px; width: 600px; height: 50px;">';
        html += '                <span style="cursor:pointer;" id="test1">Slot #1</span>';
        html += '            </div>';
        html += '        </div>';
        html += '        <div>';
        html += '            <img src="http://www.engraversnetwork.com/files/placeholder.jpg" style="position: absolute; top: 0px; left: 0px; width: 600px; height: 250px;" />';
        html += '            <div style="position: absolute; top: 250px; left: 0px; width: 600px; height: 50px;">';
        html += '                <span style="cursor:pointer;" id="test2">Slot #2</span>';
        html += '            </div>';
        html += '        </div>';
        html += '    </div>';
        html += '</div>';

        $('#test1, #test2').click(function() {
            console.log('hai');
        });

        var options =  {};

        \$el.append(html);

        var jssor_slider1 = new \$JssorSlider\$('slider-1-wrap', options);
    }, 
}}

当我点击slot #文字时，我不断收到此错误：Uncaught TypeError: elmt.getAttribute is not a function

Answer 1

用黑客修复它:(

function Attribute(elmt, name, value) {

    // @HACK: Be careful when updating api...
    if (undefined === elmt.tagName) {

        elmt = CreateElement('DIV');

        $(elmt).attr('class', 'created');
    }

    if (value == undefined)
        return elmt.getAttribute(name);

    elmt.setAttribute(name, value);
}

Answer 2

请尝试以下代码。

<div u="slides" style="cursor: move; position: absolute; left: 0px; to; width: 600px; height: 300px; overfidden;">
    <div>
        <img src="url" style="position: absolute; top: 0px; left: 0px; width: 600px; height: 250px;" />
        <div style="position: absolute; top: 250px; left: 0px; width: 600px; height: 50px;">
            <!-- your caption content here -->
        </div>
    </div>
</div>

jssor - 向标题添加操作按钮

2 个答案: