Semantic-Ui模态抖动行为

时间:2014-12-16 09:39:41

标签: javascript jquery semantic-ui

我正在使用Semantic-UI为我的项目设计网站,而在使用模态时,我看到了一种紧张的行为。

以下是链接:Click Here to Enter The Project Site

按“注册”按钮打开模态对话框,您会注意到对话框在左侧形成,然后正确显示。

无法理解这种行为的原因。

一些帮助将不胜感激。

代码:

<!-- Register Box -->
    <div class="ui fluid standard modal" id="RegisterBox">
        <div class="ui attached message" id="headerImage">
            <div class="header" id="head">
                Welcome to MeetUp!
            </div>
            <p id="subHead">Sign-up for a new account here.</p>
        </div>
        <div class="ui error form segment" id="regForm">
            <div class="ui black row">
                <div class="two fields">
                    <div class="field">
                        <label>First Name</label>
                        <input class="text" placeholder="First Name" type="text" name="fname" id="txtFn">
                    </div>
                    <div class="field">
                        <label>Last Name</label>
                        <input class="text" placeholder="Last Name" type="text" name="lname" id="txtLn">
                    </div>
                </div>
            </div>

            <div class="two fields">
                <div class="field">
                    <label>Email</label>
                    <input class="text" placeholder="Email Id" type="email" name="email" id="txtEmail">
                </div>
                <div class="field">
                    <label>Gender</label>
                    <div class="text ui selection dropdown" id="cmbSex">
                        <div class="default text">Select</div>
                        <i class="dropdown icon"></i>
                        <input type="hidden" name="gender">
                        <div class="menu">
                            <div class="item" data-value="male" data-text="Male">
                                <i class="male icon"></i>
                                Male
                            </div>
                            <div class="item" data-value="female" data-text="Female">
                                <i class="female icon"></i>
                                Female
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <div class="two fields">
                <div class="field">
                    <label>Password</label>
                    <input class="text" type="password" placeholder="Password" name="pass" id="txtPassword">
                </div>
                <div class="field">
                    <label>Confirm Password</label>
                    <input class="text" type="password" placeholder="Password" name="Cpass" id="txtRepeatPass">
                </div>
            </div>
            <div class="ui blue button" id="btnSubmit">Register</div>
        </div>
        <i class="close icon"></i>
    </div>

1 个答案:

答案 0 :(得分:0)

我发现了问题。这是由新版本的库引起的。使用旧版本[稳定]解决了它。