4 / 4 / 3
Регистрация: 10.05.2016
Сообщений: 1,117
1

Прописать в скрипте зависимость от разрешения экрана

07.07.2016, 15:29. Показов 706. Ответов 2
Метки нет (Все метки)

Author24 — интернет-сервис помощи студентам
Привет всем, нужна помощь надо как то подправить JS скрипт, то есть jQuery скрипт делает меню мобильным, мне надо как то сделать что бы при ширине экрана больше 992px ширина меню была 100%, а если ширина экрана меньше 991px то меню было мобильно
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
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
/*
 
Responsive Mobile Menu v1.1
Plugin URI: responsivemultimenu.com
 
Author: Adam Wysocki
Author URI: [url]http://oncebuilder.com[/url]
 
License: [url]http://opensource.org/licenses/MIT[/url]
 
*/
 
function adaptMenu() {
    /*  toggle menu on resize */
    $('.rmm').each(function() {
        // initialize vars
        var maxWidth = 0;
        var width = 0;
 
        // width of menu list (non-toggled)
        $('.rmm-menu').children("li").each(function() {
            if($(this).parent().hasClass('rmm-menu')){
                width = $(this).outerWidth();//outerWidth();
                if(width>0){
                    maxWidth += width;
                }
            }
        });
 
        // compare width
        var width = $('.rmm').css('max-width');
        width = width.replace('px', '');
        if ( $(this).parent().width() > width ) {
            $('.rmm-menu').removeClass("rmm-mobile");
            
            //remove all classes from mobile verion
            $(".rmm-menu ul").removeClass("rmm-subview");
            $(".rmm-menu li").removeClass("rmm-subover-hidden");
            $(".rmm-menu li").removeClass("rmm-subover-visible");
            $(".rmm-menu a").removeClass("rmm-subover-header");
 
            $(".rmm-toggled").removeClass("rmm-closed");
            $('.rmm-toggled').hide();
            
            //$('.rmm-toggled').removeClass("rmm-view");
            //$('.rmm-toggled').addClass("rmm-closed");
        }else {
            $('.rmm-menu').addClass("rmm-mobile");
            $('.rmm-toggled').show();
            $('.rmm-toggled').addClass("rmm-closed");
            
            //$('.rmm-toggled').removeClass("rmm-closed");
        }
    });
}
 
function responsiveMultiMenu() {
    $('.rmm').each(function() {
        // create mobile menu classes here to light up HTML
        $(this).find("ul").addClass("rmm-submenu");
        $(this).find("ul:first").addClass("rmm-menu");
        $(this).find("ul:first").removeClass("rmm-submenu");
        $(this).find('.rmm-submenu').prepend( '<li class="rmm-back"><a style="border: none;" href="#">&larr;</a></li>' );
        $(this).find("ul").prev().addClass("rmm-dropdown");
    
        // initialize vars
        var maxWidth = 0;
        var width = 0;
 
        // width of menu list (non-toggled)
        $('.rmm-menu').children("li").each(function() {
            if($(this).parent().hasClass('rmm-menu')){
                width = $(this).outerWidth();//outerWidth();
                if(width>0){
                    maxWidth += width;
                }
                console.log(width)
            }
        });
 
        if ($.support.leadingWhitespace) {
            $(this).css('max-width' , (maxWidth+5)+'px');
        }else{
            $(this).css('width' , (maxWidth+5)+'px');
        }
        
        // create dropdown button
        var str=''
        str+='<div class="rmm-toggled rmm-view rmm-closed">'
            str+='<div class="rmm-toggled-controls">'
                str+='<div class="rmm-toggled-title"></div>';
                str+='<div class="rmm-toggled-button"><span>&nbsp;</span><span>&nbsp;</span><span>&nbsp;</span></div>';
            str+='</div>';
        str+='</div>';
        
        $(this).prepend(str);
    });
    
    // click interacts in mobile wersion
    $('.rmm-dropdown').click(function (e) {
        if($(this).parents(".rmm-menu").hasClass('rmm-mobile')){
            e.preventDefault();
            e.stopPropagation();
            
            $(this).next().addClass("rmm-subview");
 
            var index=$(this).parent().index();
            
            var i=0;
            $(this).parent().parent().children("li").each(function() {
                if(index==$(this).index()){
                    $(this).removeClass("rmm-subover-hidden");
                    $(this).addClass("rmm-subover-visible");
                }else{
                    $(this).removeClass("rmm-subover-visible");
                    $(this).addClass("rmm-subover-hidden");
                }
            });
            $(this).addClass("rmm-subover-header");
        }
    });
    
    // click back interacts in mobile version
    $('.rmm-back a').click(function () {
        $(this).parent().parent().prev().removeClass("rmm-subover-header");
        $(this).parent().parent().removeClass("rmm-subview");
        $(this).parent().parent().parent().parent().find("li").removeClass("rmm-subover-hidden");
    });
    
    // click toggler interacts in mobile version
    $('.rmm-toggled, .rmm-toggled .rmm-button').click(function(){
        if ($(this).is(".rmm-closed")) {
            $(this).removeClass("rmm-closed");
        }else {
            $(this).addClass("rmm-closed");
        }
    }); 
}
 
jQuery(window).load(function() {
    responsiveMultiMenu();
    adaptMenu();
});
 
 
$(window).resize(function() {
    adaptMenu();
});
jQuery и JS не сильно селен уже лазию 2 часа не чего не получаться
0
Programming
Эксперт
94731 / 64177 / 26122
Регистрация: 12.04.2006
Сообщений: 116,782
07.07.2016, 15:29
Ответы с готовыми решениями:

Зависимость изображения и разрешения экрана
Здравствуйте! Проблема следующая: написана программа-заставка. В центре формы помещён PictureBox,...

Прописать стили во внешнем скрипте
Здравствуйте, подскажите можно ли изменить размер текста или как прописать стили во внешнем скрипте...

Как прописать в скрипте диапазон блоков в которых будет подгоняться шрифт
Добрый день! Помогите пожалуйста улучшить скрипт. Имеется на одной странице 100 div блоков, в...

Разрешения экрана
Прив. Делаю меню настроек, делаю дропдаун и через скрипт вывожу все разрешения экрана циклом...

2
105 / 93 / 50
Регистрация: 17.09.2015
Сообщений: 611
07.07.2016, 15:41 2
Цитата Сообщение от Matroskin_Kot Посмотреть сообщение
при ширине экрана больше 992px ширина меню была 100%, а если ширина экрана меньше 991px
Используй @media запросы
0
4 / 4 / 3
Регистрация: 10.05.2016
Сообщений: 1,117
07.07.2016, 15:47  [ТС] 3
Цитата Сообщение от Kraken73 Посмотреть сообщение
Используй @media запросы
Пробывал, проблема в том что, сам JS определяет ширину экрана, и ставить размер блоку rms style, я ставлю в медиа запросе но эффекта нету
0
07.07.2016, 15:47
IT_Exp
Эксперт
87844 / 49110 / 22898
Регистрация: 17.06.2006
Сообщений: 92,604
07.07.2016, 15:47
Помогаю со студенческими работами здесь

Изменение разрешения экрана (XP)
Во время загрузки компьютера постоянно изменяется разрешение экрана на 640Х480. Началось все после...

Изменение разрешения экрана
У меня такой вопрос. Я так понимаю, когда пишутся игры, то программа войдя в полноэкранный режим,...

Настройки разрешения экрана
После замены монитора с 15'' на 17-дюймовый не получается подобрать нормальное разрешение экрана....

Вывод разрешения экрана
Мне нужно получить текущее разрешение экрана в консольной команде. В nircmd только установку...


Искать еще темы с ответами

Или воспользуйтесь поиском по форуму:
3
Ответ Создать тему
Опции темы

КиберФорум - форум программистов, компьютерный форум, программирование
Powered by vBulletin
Copyright ©2000 - 2024, CyberForum.ru