0

I'm trying to attach JQueryUI draggable to a set of elements below:

                            <ul class="children">
                                <li id="component-nav" class="component-palette-item"><a href="#"><i class="fa fa-sitemap"></i><span> Navigation</span></a>
                                </li>
                                <li id="component-container" class="component-palette-item"><a href="#"><i class="fa fa-file-text-o"></i><span> Container</span></a>
                                </li>
                                <li id="component-row" class="component-palette-item"><a href="#"><i class="fa fa-list" ></i><span> Row</span></a>
                                </li>
                                <li id="component-column" class="component-palette-item"><a href="#"><i class="fa fa-columns"></i><span> Column</span></a>
                                </li>
                            </ul>

The draggable initialization code:

$('.component-palette-item').draggable({
        containment: designPanel,
        helper: 'clone',
        cursor: "move"
    });

The element is displayed as below:

enter image description here

As soon as I mouse down to click on one of the items, I get this error on Firefox:

TypeError: Argument 1 of Window.getComputedStyle does not implement interface Element.

The browser become suspended churning out multiple error above every time I move the mouse and the clicked element becomes like this. This is before any dragging can be performed.

enter image description here

4

0 回答 0