使用jquery重新排序div元素后,它无法正确返回原始顺序

时间:2013-04-22 21:28:19

标签: javascript jquery

当css条件为true时,我正在使用jquery代码重新排序div元素, div根据屏幕大小重新排序。重新排序工作正常,问题是当屏幕变为原始大小时重新排序回原始大小,然后它变得混乱(例如重复字段)并且无法正确显示。

//use for @media only screen and (max-width: 767px) detection    
$(window).resize(function(){

if ($('#mobile-view').css('visibility') === 'hidden') {

$("#product-gallery").insertAfter("#product-info");
}

else { 

$("#product-info").insertAfter("#product-gallery");
}

});

获得重复的HTML代码部分(选择框)

div class="productoptions section">
                        {% if product.variants.size > 1 %}
                            <div>
                                <label for="product-select">
                                    {% if product.options.size == 1 %}
                                        {{ product.options.first }}
                                    {% else %}
                                        Options
                                    {% endif %}
                                </label>
                                <span class="styleddrop">
                                    <select id="product-select" name="id">
                                    {% for variant in product.variants %}
                                        <option value="{{ variant.id }}">{{ variant.title | escape }} - {{ variant.price | money }}</option>
                                    {% endfor %}
                                    </select>
                                </span>
                            </div>

                            {% assign current_product = product %}
                            {% include 'product-dropdown-js' with 'product-info' %}

                                    {% else %}
                            <p>
                                {% if product.options.size == 1 %}
                                    {{ product.options.first }}:
                                {% else %}
                                    Option:
                                {% endif %}
                                {{ product.variants.first.title }}
                            </p>
                            <input type="hidden" name="id" value="{{ product.variants.first.id }}" />
                        {% endif %}

                        <div>

0 个答案:

没有答案