Question

我正在处理一些似乎在某种程度上相互冲突的不同脚本。打开建议，以获得更好的代码，用于内容交换部分。我喜欢下拉选择选项的风格和功能。

第一个脚本来自Codrops： http://tympanus.net/Development/SelectInspiration/index4.html

我将这种样式与此处的内容交换功能结合起来： http://jsfiddle.net/Artsen/gDPJG/

在我添加内容交换代码之前，Codrops示例的功能在我的网站上运行良好。

这是（我认为）在点击选项后控制选择选项的关闭：

来自Codrops ::

的selectFx.js第238行

/**
 * open/close select
 * when opened show the default placeholder if any
 */
SelectFx.prototype._toggleSelect = function() {
    // remove focus class if any..
    this._removeFocus();

    if( this._isOpen() ) {
        if( this.current !== -1 ) {
            // update placeholder text
            this.selPlaceholder.textContent = this.selOpts[ this.current ].textContent;
        }
        classie.remove( this.selEl, 'cs-active' );
    }
    else {
        if( this.hasDefaultPlaceholder && this.options.stickyPlaceholder ) {
            // everytime we open we wanna see the default placeholder text
            this.selPlaceholder.textContent = this.selectedOpt.textContent;
        }
        classie.add( this.selEl, 'cs-active' );
    }
}

为删除了关闭功能的内容交换添加了代码：

    $('.info-container div').hide();

$('.div-toggler li a').click(function () {
    if ($(this).hasClass('active') == true) {
        return false;
    } else {
        $('a.active').removeClass('active');
        $(this).addClass('active');

        $('.info-container div').fadeOut();
        var contentToLoad = $(this).attr('href');
        $(contentToLoad).delay(400).fadeIn("slow");

        return false;
    }


});

目前的工作副本在这里.. unreasonable.institute/network

选择项目应按原样显示，内容应按原样进行交换，但选择后选项仍保留在页面上。它应该像Codrops的例子一样关闭。

选择选项后关闭选择框容器。代码冲突？

0 个答案: