Справочник функций

Ваш аккаунт

Войти через: 
Забыли пароль?
Регистрация
Информацию о новых материалах можно получать и без регистрации:

Почтовая рассылка

Подписчиков: -1
Последний выпуск: 19.06.2015

Javascript использует все время 3 условие

96K
16 сентября 2015 года
Arman Kobelekov
1 / / 16.09.2015
У меня три условия и каждый раз когда я запускаю у меня работает только последние условие. Вроде как все правильно. Когда оставляю 2 условия javavascript работает, нормально для каждого из двух расширения.
Код:
<script type="text/javascript">
            if (screen.width == 1280) {
                $(function() {
                    /**
                    * for each menu element, on mouseenter,
                    * we enlarge the image, and show both sdt_active span and
                    * sdt_wrap span. If the element has a sub menu (sdt_box),
                    * then we slide it - if the element is the last one in the menu
                    * we slide it to the left, otherwise to the right
                    */
                    $('#sdt_menu > li').bind('mouseenter', function() {
                        var $elem = $(this);
                        $elem.find('img')
                            .stop(true)
                            .animate({
                                'width': '100%',
                                'height': '170px',
                                'left': '0px'
                            }, 400, 'easeOutBack')
                            .andSelf()
                            .find('.sdt_wrap')
                            .stop(true)
                            .animate({ 'top': '250px' }, 500, 'easeOutBack')
                            .andSelf()
                            .find('.sdt_active')
                            .stop(true)
                            .animate({ 'height': '170px' }, 300, function() {
                                var $sub_menu = $elem.find('.sdt_box');
                                if ($sub_menu.length) {
                                    var left = '250px';
                                    if ($elem.parent().children().length == $elem.index() + 1)
                                        left = '-250px';
                                    $sub_menu.show().animate({ 'left': left }, 200);
                                }
                            });
                    }).bind('mouseleave', function() {
                        var $elem = $(this);
                        var $sub_menu = $elem.find('.sdt_box');
                        if ($sub_menu.length)
                            $sub_menu.hide().css('left', '0px');

                        $elem.find('.sdt_active')
                            .stop(true)
                            .animate({ 'height': '0px' }, 300)
                            .andSelf().find('img')
                            .stop(true)
                            .animate({
                                'width': '0px',
                                'height': '0px',
                                'left': '150px'
                            }, 400)
                            .andSelf()
                            .find('.sdt_wrap')
                            .stop(true)
                            .css('color', 'red')
                            .animate({ 'top': '100px' }, 500);


                    });
                });
            }
            else if (screen.width == 1600) {
                $(function() {
                    /**
                    * for each menu element, on mouseenter,
                    * we enlarge the image, and show both sdt_active span and
                    * sdt_wrap span. If the element has a sub menu (sdt_box),
                    * then we slide it - if the element is the last one in the menu
                    * we slide it to the left, otherwise to the right
                    */
                    $('#sdt_menu > li').bind('mouseenter', function() {
                        var $elem = $(this);
                        $elem.find('img')
                            .stop(true)
                            .animate({
                                'width': '80%',
                                'height': '170px',
                                'left': '0px'
                            }, 400, 'easeOutBack')
                            .andSelf()
                            .find('.sdt_wrap')
                            .stop(true)
                            .animate({ 'top': '250px' }, 500, 'easeOutBack')
                            .andSelf()
                            .find('.sdt_active')
                            .stop(true)
                            .animate({ 'height': '170px' }, 300, function() {
                                var $sub_menu = $elem.find('.sdt_box');
                                if ($sub_menu.length) {
                                    var left = '250px';
                                    if ($elem.parent().children().length == $elem.index() + 1)
                                        left = '-250px';
                                    $sub_menu.show().animate({ 'left': left }, 200);
                                }
                            });
                    }).bind('mouseleave', function() {
                        var $elem = $(this);
                        var $sub_menu = $elem.find('.sdt_box');
                        if ($sub_menu.length)
                            $sub_menu.hide().css('left', '0px');

                        $elem.find('.sdt_active')
                            .stop(true)
                            .animate({ 'height': '0px' }, 300)
                            .andSelf().find('img')
                            .stop(true)
                            .animate({
                                'width': '0px',
                                'height': '0px',
                                'left': '150px'
                            }, 400)
                            .andSelf()
                            .find('.sdt_wrap')
                            .stop(true)
                            .css('color', 'red')
                            .animate({ 'top': '100px' }, 500);


                    });
                });
            }
           
           else if (screen.width <= 1920) {
                $(function() {
                    /**
                    * for each menu element, on mouseenter,
                    * we enlarge the image, and show both sdt_active span and
                    * sdt_wrap span. If the element has a sub menu (sdt_box),
                    * then we slide it - if the element is the last one in the menu
                    * we slide it to the left, otherwise to the right
                    */
                    $('#sdt_menu > li').bind('mouseenter', function() {
                        var $elem = $(this);
                        $elem.find('img')
                            .stop(true)
                            .animate({
                                'width': '60%',
                                'height': '170px',
                                'left': '0px'
                            }, 400, 'easeOutBack')
                            .andSelf()
                            .find('.sdt_wrap')
                            .stop(true)
                            .animate({ 'top': '250px' }, 500, 'easeOutBack')
                            .andSelf()
                            .find('.sdt_active')
                            .stop(true)
                            .animate({ 'height': '170px' }, 300, function() {
                                var $sub_menu = $elem.find('.sdt_box');
                                if ($sub_menu.length) {
                                    var left = '250px';
                                    if ($elem.parent().children().length == $elem.index() + 1)
                                        left = '-250px';
                                    $sub_menu.show().animate({ 'left': left }, 200);
                                }
                            });
                    }).bind('mouseleave', function() {
                        var $elem = $(this);
                        var $sub_menu = $elem.find('.sdt_box');
                        if ($sub_menu.length)
                            $sub_menu.hide().css('left', '0px');

                        $elem.find('.sdt_active')
                            .stop(true)
                            .animate({ 'height': '0px' }, 300)
                            .andSelf().find('img')
                            .stop(true)
                            .animate({
                                'width': '0px',
                                'height': '0px',
                                'left': '150px'
                            }, 400)
                            .andSelf()
                            .find('.sdt_wrap')
                            .stop(true)
                            .css('color', 'red')
                            .animate({ 'top': '100px' }, 500);


                    });
                });
            }
           
        </script>
8
16 сентября 2015 года
mfender
3.5K / / 15.06.2005
Всё правильно, оно и выполняется, потому что во всех трёх случаях оно - единственно верное условие.
Таким образом, следует уточнить:
 
Код:
if(screen.width >= 1200 && screen.width < 1600){
.........................
}else if(screen.width >= 1600 && screen.width < 1920){
.........................
}else if(screen.width > 1600 && screen.width < 1920){
.........................
}
Реклама на сайте | Обмен ссылками | Ссылки | Экспорт (RSS) | Контакты
Добавить статью | Добавить исходник | Добавить хостинг-провайдера | Добавить сайт в каталог