jquerycssjquery-uishake

jQuery UI shake effect starts on new line


On the jsfiddle link provided below, I have a paragraph with text, and then an input box. I use jQuery UI to shake the input box, but bizarrely the shake effect starts one line below the text.

http://jsfiddle.net/VQj2Z/6/


Solution

  • if you check source code during the effect, you see that the input is wrapped by <div class="ui-effects-wrapper"> and this is why it folds to next line. I am not familiar with mootools, but quick'n'dirty fix would be to assign display:inline to that div:

    <style type="text/css">
        .ui-effects-wrapper {
            display:inline;
        }
    </style>