Отвязать событие для блока

@Dr@gon. · Регистрация: 22.11.2010

Студворк — интернет-сервис помощи студентам

Здравствуйте!
На сайте доделываю боковую панельку по умолчанию она имеет ширину 70px(маленькая) при клике на кнопку ширина увеличивается до 300px(большая) на этой панельке есть инпут поиск и два инпута (логин/пароль) обернутые блоком div. При большой панельке если кликнуть куда нибудь в любое место на странице включая боковую панель она (она панель) автоматически уменьшается до своего первоначального состояния 70px, как сделать чтобы если кликать на боковой панели она не уменьшалась, а если кликать по контенту на странице то уменьшалась до 70px.

для инпута поиск есть код который отменяет действие но там все происходит по событию focus а для div нет такого события

Вот код для инпута поиск

JavaScript
1
2
3
4
5
6
7
8
    $('.searchForm input[type=text]').focus(function () {
                $('html').unbind('click');  
            }).blur(function() {
                GNmenu.bodyClick();                                             
            });
                                            
        
        },

код полностью:

JavaScript
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
$(function () {
    
    var GNmenu = {
        isMenuOpened: false,
        init : function () {
 
            var menuBtn = $('#btn-menu');
            
            // make it work on touch screen device and mouse click заставить его работать на устройстве с сенсорным экраном и мыши
            menuBtn.on('touchstart click', function (e) {
                e.stopPropagation();
                e.preventDefault();
                
                /* if the menu is half show, show the whole menu instead of hide it  если меню половина шоу, показать все меню вместо скрыть*/
                if ($('#sideNav').hasClass('showHalfMenu') && !$('#sideNav').hasClass('showFullMenu')) {
                    GNmenu.showFullMenu();
                } else {
                    GNmenu.toggleMenu();                                                
                }
                
            });
 
            // only do all this if it's desktop ---------------------------------------------------------------------При наведении на панель открывается полностью
            /* if (!GNmenu.isMobile()) {
 
                menuBtn.bind('mouseover', function () {
                        GNmenu.showHalfMenu();
                });
                
                menuBtn.bind('mouseout', function () {
                        GNmenu.hideMenu();
                }); 
            
                $('#sideNav').bind('mouseover', function () {
                        GNmenu.showFullMenu();
                });                                         
 
                // this allow user to hide the menu by clicking on web page body
                GNmenu.bodyClick();
            }*/
            
            
            // search form форма поиска
            // unbind the bodyClick event----------------------------------------отвязать событие bodyClick 
            $('.searchForm input[type=text], .auth input[type=text]').focus(function () {
                $('html').unbind('click');  
            }).blur(function() {
                GNmenu.bodyClick();                                             
            });
                                            
        
        },
        
        
        
        bodyClick: function () {
        
            $('html').bind('click',function () {
                if (GNmenu.isMenuOpened) {
                    GNmenu.hideMenu();                                                      
                }
            });                 
        
        },
        
        toggleMenu: function () {
            if (!GNmenu.isMenuOpened) {
                GNmenu.showFullMenu();
            } else {
                GNmenu.hideMenu();                  
            }
        },
        
        showHalfMenu: function () {
            $('#sideNav').addClass('showHalfMenu');
            GNmenu.isMenuOpened = true;                 
        },
        //--------------------------Добавление класса
        showFullMenu: function () {
            $('#btn-menu').addClass('icon-menu-active abuttonm icon-butclose');
            $('#sideNav').addClass('showFullMenu');
            $('#sideNav ul li a').addClass('levo');
            $('.hide').addClass('hideli');
            $('#contte').addClass('ledo');
            $('.minbar').addClass('hideminbar');
            $('.whitefon').addClass('whitefonleft');
            $('.cont').addClass('widthside');
            $('#libut').addClass('libuttonm');
            
            $('html').addClass('cursor');               
            GNmenu.isMenuOpened = true;                         
        },
        //------------------------------Удаление класса
        hideMenu: function () {
            $('#btn-menu').removeClass('icon-menu-active abuttonm icon-butclose');
            $('#sideNav').removeClass('showFullMenu showHalfMenu'); 
            $('#sideNav ul li a').removeClass('levo');  
            $('.hide').removeClass('hideli');
            $('#contte').removeClass('ledo');   
            $('.minbar').removeClass('hideminbar');
            $('.whitefon').removeClass('whitefonleft');
            $('.cont').removeClass('widthside');
            $('#libut').removeClass('libuttonm');           
            $('html').removeClass('cursor');                        
            GNmenu.isMenuOpened = false;                    
        },
        
        // Mobile Detection: [url]http://stackoverflow.com/a/11381730[/url]             
        isMobile: function() {
            var check = false;
            (function(a){if(/(android|bb\d+|meego).+mobile|avantgo|bada\/|blackberry|blazer|compal|elaine|fennec|hiptop|iemobile|ip(hone|od)|iris|kindle|lge |maemo|midp|mmp|netfront|opera m(ob|in)i|palm( os)?|phone|p(ixi|re)\/|plucker|pocket|psp|series(4|6)0|symbian|treo|up\.(browser|link)|vodafone|wap|windows (ce|phone)|xda|xiino/i.test(a)||/1207|6310|6590|3gso|4thp|50[1-6]i|770s|802s|a wa|abac|ac(er|oo|s\-)|ai(ko|rn)|al(av|ca|co)|amoi|an(ex|ny|yw)|aptu|ar(ch|go)|as(te|us)|attw|au(di|\-m|r |s )|avan|be(ck|ll|nq)|bi(lb|rd)|bl(ac|az)|br(e|v)w|bumb|bw\-(n|u)|c55\/|capi|ccwa|cdm\-|cell|chtm|cldc|cmd\-|co(mp|nd)|craw|da(it|ll|ng)|dbte|dc\-s|devi|dica|dmob|do(c|p)o|ds(12|\-d)|el(49|ai)|em(l2|ul)|er(ic|k0)|esl8|ez([4-7]0|os|wa|ze)|fetc|fly(\-|_)|g1 u|g560|gene|gf\-5|g\-mo|go(\.w|od)|gr(ad|un)|haie|hcit|hd\-(m|p|t)|hei\-|hi(pt|ta)|hp( i|ip)|hs\-c|ht(c(\-| |_|a|g|p|s|t)|tp)|hu(aw|tc)|i\-(20|go|ma)|i230|iac( |\-|\/)|ibro|idea|ig01|ikom|im1k|inno|ipaq|iris|ja(t|v)a|jbro|jemu|jigs|kddi|keji|kgt( |\/)|klon|kpt |kwc\-|kyo(c|k)|le(no|xi)|lg( g|\/(k|l|u)|50|54|\-[a-w])|libw|lynx|m1\-w|m3ga|m50\/|ma(te|ui|xo)|mc(01|21|ca)|m\-cr|me(rc|ri)|mi(o8|oa|ts)|mmef|mo(01|02|bi|de|do|t(\-| |o|v)|zz)|mt(50|p1|v )|mwbp|mywa|n10[0-2]|n20[2-3]|n30(0|2)|n50(0|2|5)|n7(0(0|1)|10)|ne((c|m)\-|on|tf|wf|wg|wt)|nok(6|i)|nzph|o2im|op(ti|wv)|oran|owg1|p800|pan(a|d|t)|pdxg|pg(13|\-([1-8]|c))|phil|pire|pl(ay|uc)|pn\-2|po(ck|rt|se)|prox|psio|pt\-g|qa\-a|qc(07|12|21|32|60|\-[2-7]|i\-)|qtek|r380|r600|raks|rim9|ro(ve|zo)|s55\/|sa(ge|ma|mm|ms|ny|va)|sc(01|h\-|oo|p\-)|sdk\/|se(c(\-|0|1)|47|mc|nd|ri)|sgh\-|shar|sie(\-|m)|sk\-0|sl(45|id)|sm(al|ar|b3|it|t5)|so(ft|ny)|sp(01|h\-|v\-|v )|sy(01|mb)|t2(18|50)|t6(00|10|18)|ta(gt|lk)|tcl\-|tdg\-|tel(i|m)|tim\-|t\-mo|to(pl|sh)|ts(70|m\-|m3|m5)|tx\-9|up(\.b|g1|si)|utst|v400|v750|veri|vi(rg|te)|vk(40|5[0-3]|\-v)|vm40|voda|vulc|vx(52|53|60|61|70|80|81|83|85|98)|w3c(\-| )|webc|whit|wi(g |nc|nw)|wmlb|wonu|x700|yas\-|your|zeto|zte\-/i.test(a.substr(0,4)))check = true})(navigator.userAgent||navigator.vendor||window.opera);
            
            return check;                   
        }
        
    }
    
    // Run the Google Nexus Inspired Menu
    GNmenu.init();
    
});

@Dr@gon. · 04.11.2014, 12:11 **[ТС]**

Тема еще актуальна буду рад помощи

@Lazy_Den · 04.11.2014, 15:05

Dr@gon., я не вижу вашу структуру, но попробую описать то, что вам надо сделать. На тех элементах, где клик не должен сворачивать панель, добавляете событие click (если его еще нет) с отменой всплятия событий. Например, по клику на форму поиска, панель не должна сворачиваться:

JavaScript
1
2
3
$('.search_form').on('click', function(e){
    e.stopPropagation();
});

Новые блоги и статьи Все статьи Все блоги /
Символьное дифференцирование igorrr37 13.02.2026 / * Логарифм записывается как: (x-2)log(x^2+2) - означает логарифм (x^2+2) по основанию (x-2). Унарный минус обозначается как ! в-строка - входное арифметическое выражение в инфиксной(обычной). . .	Камера Toupcam IUA500KMA Eddy_Em 12.02.2026 Т. к. у всяких "хикроботов" слишком уж мелкий пиксель, для подсмотра в ESPriF они вообще плохо годятся: уже 14 величину можно рассмотреть еле-еле лишь на экспозициях под 3 секунды (а то и больше),. . .	И ясному Солнцу zbw 12.02.2026 И ясному Солнцу, и светлой Луне. В мире покоя нет и люди не могут жить в тишине. А жить им немного лет.	«Знание-Сила» zbw 12.02.2026 «Знание-Сила» «Время-Деньги» «Деньги -Пуля»
SDL3 для Web (WebAssembly): Подключение Box2D v3, физика и отрисовка коллайдеров 8Observer8 12.02.2026 Содержание блога Box2D - это библиотека для 2D физики для анимаций и игр. С её помощью можно определять были ли коллизии между конкретными объектами и вызывать обработчики событий столкновения. . . .	SDL3 для Web (WebAssembly): Загрузка PNG с прозрачным фоном с помощью SDL_LoadPNG (без SDL3_image) 8Observer8 11.02.2026 Содержание блога Библиотека SDL3 содержит встроенные инструменты для базовой работы с изображениями - без использования библиотеки SDL3_image. Пошагово создадим проект для загрузки изображения. . .	SDL3 для Web (WebAssembly): Загрузка PNG с прозрачным фоном с помощью SDL3_image 8Observer8 10.02.2026 Содержание блога Библиотека SDL3_image содержит инструменты для расширенной работы с изображениями. Пошагово создадим проект для загрузки изображения формата PNG с альфа-каналом (с прозрачным. . .	Установка Qt-версии Lazarus IDE в Debian Trixie Xfce volvo 10.02.2026 В общем, достали меня глюки IDE Лазаруса, собранной с использованием набора виджетов Gtk2 (конкретно: если набирать текст в редакторе и вызвать подсказку через Ctrl+Space, то после закрытия окошка. . .

@Dr@gon. 19 / 19 / 9 Регистрация: 22.11.2010 Сообщений: 321
	04.11.2014, 12:11 [ТС]
	Тема еще актуальна буду рад помощи 0

Опции темы