Как сдвинуть div, нажав в любом месте на странице

Question

Как сдвинуть div, нажав в любом месте на странице

0

У меня есть div. который я делаю слайд вверх и сползаю функцией jquery, функция myjquery

<script type="text/javascript">
    jQuery(window).load(function () {

        $("#nav > li > a").click(function () { // binding onclick
            if ($(this).parent().hasClass('selected')) {
                $("#nav .selected div div").slideUp(700); // hiding popups
                $("#nav .selected").removeClass("selected");
            } else {
                $("#nav .selected div div").slideUp(400); // hiding popups
                $("#nav .selected").removeClass("selected");

                if ($(this).next(".subs").length) {
                    $(this).parent().addClass("selected"); // display popup
                    $(this).next(".subs").children().slideDown(200);
                }
            }
        });

    });
</script>

и html

<ul id="nav">    
            <li><a href="#"><b>Login</b></a>
                <div class="subs">
                    <div>
                        <ul>
                            <table style="margin-right:12PX;width:200px;overflow:scroll;">
                            <tr style="width:70px"><td>Mobile Number</td></tr>
                           <tr> <td><asp:TextBox runat="server"  ID="TextBox1" CssClass="selectfield" Width="170px"/></td>
                            </tr><tr><td>Password</td></tr><tr><td><asp:TextBox runat="server" ID="TextBox2" TextMode="Password" Width="170px" CssClass="selectfield"  /></td></tr>
                            <tr style="height:5px;"><td></td></tr>
                            <tr><td>
                                &nbsp;<asp:Button ID="Button1" 
                                    runat="server" Text="Login" CssClass="btn" onclick="Button1_Click"  /></td></tr>
                                <tr><td style="color:Red;">
                                    <asp:LinkButton ID="LinkButton1" runat="server" CssClass="link">Forget Password</asp:LinkButton></td></tr>
                            </table>
                            </ul>

когда я нажимаю на логин, div sub сдвигается вниз и снова нажимает логин на слайд-шоу. он работает отлично. Я хочу, когда я нажму на login div, должен сдвинуться вниз. после, если щелкнуть в любом месте страницы, кроме <div>. <div> должен располагаться вверх.

Vikas Rana 09 окт. 2013, в 08:30

Источник

Теги:

jquery

html

asp.net

3 ответа

1

Это будет работать

$(document).bind("click", function (event) {      
    if (!$(event.target).is('.subs') && $(event.target).closest('.subs').length==0) {
        $("#nav .selected div div").slideUp(700);
        $("#nav .selected").removeClass("selected");
    }
});

вам также нужно позаботиться, если вы нажали внутри div.

Patel 09 окт. 2013, в 03:58

0

как вы видели мой HTML, я использую Div для входа в систему, я должен щелкнуть внутри Div, есть ли какой-либо метод, я нажимаю внутри Div ничего не происходит. В противном случае он работает нормально
Vikas Rana 09 окт. 2013, в 06:48
0

что ты хочешь тогда? приведенный выше код будет скрывать ваш div при нажатии в любом месте документа, кроме самого div
Ronak Patel 09 окт. 2013, в 06:51
0

когда я нажимаю внутри div, div скрывает, я не хочу этого
Vikas Rana 09 окт. 2013, в 07:17
0

Это не скроет div, если вы нажмете на div с подпунктами имени класса
Ronak Patel 09 окт. 2013, в 08:45
0

Я делаю это, изменяя «.sub» на «#nav> li> a» (проверьте мой HTML). Вот почему я получаю это. потому что с классом '.sub' div скользит вверх и вниз автоматически
Vikas Rana 09 окт. 2013, в 08:51

Показать ещё 3 комментария

0

хорошо, у меня есть способ обойти это. Надеюсь, что он сработает для вас. Пожалуйста, возьмите контейнер Container или возьмите тег тела (размер которого таков, что он охватывает всю страницу, например, 100%) и добавьте его в onclick событие и в этом случае раздвинуть div.Take Уход за тем, что ваш контейнер Container или тег Body должен покрывать всю страницу, чтобы он выглядел так, как будто пользователь щелкает на любом месте на странице. это трюк

сообщите мне, помогает ли это или нет.

khalid khan 09 окт. 2013, в 05:00

Ещё вопросы

как вы видели мой HTML, я использую Div для входа в систему, я должен щелкнуть внутри Div, есть ли какой-либо метод, я нажимаю внутри Div ничего не происходит. В противном случае он работает нормально
что ты хочешь тогда? приведенный выше код будет скрывать ваш div при нажатии в любом месте документа, кроме самого div
когда я нажимаю внутри div, div скрывает, я не хочу этого
Это не скроет div, если вы нажмете на div с подпунктами имени класса
Я делаю это, изменяя «.sub» на «#nav> li> a» (проверьте мой HTML). Вот почему я получаю это. потому что с классом '.sub' div скользит вверх и вниз автоматически

Prasad Jadhav · Accepted Answer · 2013-10-09T05-07-00.000Z

Проверьте эту рабочую скрипту: http://jsfiddle.net/WxcLV/10/
Вместо того, чтобы click попробуйте его с помощью click как mouseup ниже:

$('#loginButton').mouseup(function(login) {
    $('#loginBox').toggle();
    $('#loginButton').toggleClass('active');
});

$('#loginTable').mouseup(function() { 
    // to avoid hiding div 
    return false;
});
$(this).mouseup(function(login) {
    if(!($(login.target).parent('#loginButton').length > 0)) {
        $('#loginButton').removeClass('active');
        $('#loginBox').hide();
    }
});

Прасад Я пытаюсь это, но это не работает, Div слайд вверх и вниз, когда я нажимаю на логин
Я делаю это, изменяя имя целевого div, он работает, но не всегда hw, чтобы улучшить его, чтобы он работал всегда, когда я нажимаю на кнопку входа
@VikasRana: Пожалуйста, проверьте обновленный ответ.