Все технические форумы на одном сайте Удобный поиск информации с популярных форумов в одном месте
Вопрос: Необходимо на jquery сделать добавление/удаление блока с контентом

Приветствую,

в общем суть следующая, необходимо сделать функцию по добавлению и удалению блока div с полями input.

Изначально имеем только блок "Товар №1" он должен оставаться всегда, нужно сделать возможность что бы по желанию пользователь мог добавить или удалить дополнительные блоки "Товар №2 - Товар №5" , т.е. вставить или удалить код нажатием на кнопку добавить/удалить. Желательно именно добавить/удалить, а не скрыть/показать.
С Jquery знаком только поверхностно, самому не разобраться, поэтому прошу помочь, отозвавшимся заранее спасибо!

Рабочий код:

HTML5
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
<form enctype="text/plain" id="checkout-form" method="POST" action="" class="methods-list" onsubmit="return shopCheckOut();">
  <input type="hidden" name="mode" value="change" id="checkout-form-mode">
  <input type="hidden" name="ssid" id="checkout-form-ssid" value="$SSID$">
  <input type="hidden" name="payment_id" value="2" id="payment_id">
  <input type="hidden" name="delivery_id" value="2" id="delivery_id">
 
  <div><input type="text" class="fw text" name="fld3" id="order-fld-3" value="" placeholder="Имя, Фамилия*"></div>
  <div><input type="text" class="fw text" name="fld2" id="order-fld-2" value="" placeholder="Адрес (ул, дом, кв.)*"></div>
  <div><input type="text" class="fw text" name="fld5" id="order-fld-5" value="" placeholder="Индекс, Город*"></div>
  <div><select name="fld7" id="order-fld-7">
                    <option value="Россия" selected="">Россия</option>
                    <option value="Беларусь">Беларусь</option>
                    <option value="Украина">Украина</option>
                    <option value="Казахстан">Казахстан</option>
                    <option value="Кыргызстан">Кыргызстан</option>
                    </select>
  </div>
  <div><input type="text" class="fw text" name="fld8" id="order-fld-8" value="" placeholder="E-mail*"></div>
  <div><input type="text" class="fw text" name="fld1" id="order-fld-1" value="" placeholder="Контактный телефон*"></div>
  <div><input type="text" class="fw text" name="fld9" id="order-fld-9" value="" placeholder="Мобильный телефон"></div>
 
  <div>
    <table>
      <tbody>
        <tr>
          <td><input type="text" class="text promo" value="" name="fld12" id="order-fld-12" placeholder="Код скидки/купона/акции"></td>
          <td><input type="button" value="Проверить код" onclick="checkPromo('12')"></td>
          <td id="res12" style="display:none;"><img src="/.s/img/icon/ajsml.gif"></td>
        </tr>
      </tbody>
    </table>
  </div>
  </div>
 
  <div id="add-goods">
    <h2>Добавить товары</h2>
    <div class="goods-1">
      <h3>Товар №1</h3>
      <input type="text" class="fw text" name="fld13" id="order-fld-13" value="" placeholder="Название товара">
      <input type="text" class="fw text" name="fld14" id="order-fld-14" value="" placeholder="Ссылка на товар">
      <input type="text" class="fw text" name="fld15" id="order-fld-15" value="" placeholder="Цена в магазине">
      <input type="text" class="fw text" name="fld16" id="order-fld-16" value="" placeholder="Доставка из магазина">
    </div>
    <div class="goods-2">
      <h3>Товар №2</h3>
      <input type="text" class="fw text" name="fld17" id="order-fld-17" value="" placeholder="Название товара">
      <input type="text" class="fw text" name="fld18" id="order-fld-18" value="" placeholder="Ссылка на товар">
      <input type="text" class="fw text" name="fld19" id="order-fld-19" value="" placeholder="Цена в магазине">
      <input type="text" class="fw text" name="fld20" id="order-fld-20" value="" placeholder="Доставка из магазина">
    </div>
    <div class="goods-3">
      <h3>Товар №3</h3>
      <input type="text" class="fw text" name="fld21" id="order-fld-21" value="" placeholder="Название товара">
      <input type="text" class="fw text" name="fld22" id="order-fld-22" value="" placeholder="Ссылка на товар">
      <input type="text" class="fw text" name="fld23" id="order-fld-23" value="" placeholder="Цена в магазине">
      <input type="text" class="fw text" name="fld24" id="order-fld-24" value="" placeholder="Доставка из магазина">
    </div>
    <div class="goods-4">
      <h3>Товар №4</h3>
      <input type="text" class="fw text" name="fld25" id="order-fld-25" value="" placeholder="Название товара">
      <input type="text" class="fw text" name="fld26" id="order-fld-26" value="" placeholder="Ссылка на товар">
      <input type="text" class="fw text" name="fld27" id="order-fld-27" value="" placeholder="Цена в магазине">
      <input type="text" class="fw text" name="fld28" id="order-fld-28" value="" placeholder="Доставка из магазина">
    </div>
    <div class="goods-5">
      <h3>Товар №5</h3>
      <input type="text" class="fw text" name="fld29" id="order-fld-29" value="" placeholder="Название товара">
      <input type="text" class="fw text" name="fld30" id="order-fld-30" value="" placeholder="Ссылка на товар">
      <input type="text" class="fw text" name="fld31" id="order-fld-31" value="" placeholder="Цена в магазине">
      <input type="text" class="fw text" name="fld32" id="order-fld-32" value="" placeholder="Доставка из магазина">
    </div>
  </div>
 
</form>
Песочница:

Пример того что хотелось бы получить:

Добавлено через 2 часа 21 минуту
Смастерил вот такую конструкцию, но цикл не работает до конца (вторая часть скрипта), подскажите почему?

HTML5
1
2
3
4
5
6
7
<div class="add-cut">
<button class="add">Добавить</button>
</div>
<ul class="l1">
   <li class="it1">Название</li>    
   <li class="it2">Цена</li>    
 </ul>
Javascript
1
2
3
4
5
6
7
8
9
10
$('.add').bind('click', function() {
  $('<ul class="l2"><li class="it1">Название</li><li class="item it2">Цена</li></ul>').insertAfter($('.l1'));
  $(".add-cut").empty();
  $('<button class="cut">Удалить</button>').prependTo($('.add-cut'));
});
 
$('.cut').bind('click', function() {
    $(".add-cut").empty();
  $('<button class="add">Добавить</button>').prependTo($('.add-cut'));
});
Ответ: EvgenStor, я б на вашем месте поискал возможность стандартизовать добавляющиеся списки, чтобы можно было решить задачу одним скриптом, а не 5-ю однотипными.
Вопрос: спойлер, как сделать кнопку "скрыть"?

есть код для спойлера, на сайте все нормально полностью функционирует, интересует как сделать кнопку которая бы закрывала скрытый текст ее нажатием где нибудь в конце статьи.

пример:

Заголовок

Здесь скрытый текст

тут конец статьи, и кнопка "скрыть"(чтобы не обязательно ползти опять наверх и скрывать только через заголовок)



Вот собственно код спойлера

<a href="javascript:sh()">Заголовок</a>
<div id="blabla" style="display:none">
Здесь скрытый текст
</div>

<script type="text/javascript">
function sh() {
obj = document.getElementById("blabla");
if( obj.style.display == "none" ) { obj.style.display = "block"; } else { obj.style.display = "none"; }
}
</script>
Ответ:
<a href="javascript:sh('blabla1')">Заголовок</a>
<div id="blabla1" style="display:none">Здесь скрытый текст 1</div>

<a href="javascript:sh('blabla2')">Заголовок</a>
<div id="blabla2" style="display:none">Здесь скрытый текст 2</div>

<script type="text/javascript">
function sh(id) {
obj = document.getElementById(id);
if( obj.style.display == "none" ) {
obj.style.display = "block";
} else {
obj.style.display = "none";
}
}
</script>
Вопрос: Скрыть поле

Доброго времени суток!
При открытии страницы с формой заполнения заказа, существуют два вида получателя(скрин "Оформление заказа").
Если выбран получатель "физическое лицо", тогда поле "Название компании получателя" необходимо скрыть.
Сейчас, поле "Название компании получателя" скрывается, если переключить на "юридическое лицо", потом обратно включить "физическое лицо".
За переключение типов получателей отвечает: if ($('input[name="ORDER_PROP_151"]:checked').prop('value') == "recipient_phys") - физическое лицо, if ($('input[name="ORDER_PROP_151"]:checked').prop('value') == "recipient_jurid") - юридическое лицо.
Подскажите, пожалуйста, как реализовать, чтоб поле "Название компании получателя" скрывалось сразу при открытии страницы.
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
<script type="text/javascript">
    $(document).ready(function () {
        $(document).on('click', 'a.slide', function(){
            //юр. лицо
            if ($('input[name="ORDER_PROP_144"]:checked').prop('value') == "recipient_phys") {
                $('input[name="ORDER_PROP_147"]').prop('value', '');
                $('div[data-property-id-row="'+147+'"]').css("display", "none");
                $('input[name="ORDER_PROP_147"]').css("display", "none");
            }
            if ($('input[name="ORDER_PROP_144"]:checked').prop('value') == "recipient_jurid") {
                $('input[name="ORDER_PROP_148"]').prop('value', '');
                $('div[data-property-id-row="'+148+'"]').css("display", "none");
                $('input[name="ORDER_PROP_148"]').css("display", "none");
                //$('input[name="ORDER_PROP_148"] + br').hide();
                $('input[name="ORDER_PROP_149"]').prop('value', '');
                $('div[data-property-id-row="'+149+'"]').css("display", "none");
                $('input[name="ORDER_PROP_149"]').css("display", "none");
                //$('input[name="ORDER_PROP_149"] + br').hide();
                $('input[name="ORDER_PROP_150"]').prop('value', '');
                $('div[data-property-id-row="'+150+'"]').css("display", "none");
                $('input[name="ORDER_PROP_150"]').css("display", "none");
                //$('input[name="ORDER_PROP_150"] + br').hide();
            }
            //физ. лицо
            if ($('input[name="ORDER_PROP_151"]:checked').prop('value') == "recipient_phys") {
                $('input[name="ORDER_PROP_154"]').prop('value', '');
                $('div[data-property-id-row="'+154+'"]').css("display", "none");
                $('input[name="ORDER_PROP_154"]').css("display", "none");
            }
            if ($('input[name="ORDER_PROP_151"]:checked').prop('value') == "recipient_jurid") {
                $('input[name="ORDER_PROP_155"]').prop('value', '');
                $('div[data-property-id-row="'+155+'"]').css("display", "none");
                $('input[name="ORDER_PROP_155"]').css("display", "none");
                //$('input[name="ORDER_PROP_155"] + br').hide();
                $('input[name="ORDER_PROP_156"]').prop('value', '');
                $('div[data-property-id-row="'+156+'"]').css("display", "none");
                $('input[name="ORDER_PROP_156"]').css("display", "none");
                //$('input[name="ORDER_PROP_156"] + br').hide();
                $('input[name="ORDER_PROP_157"]').prop('value', '');
                $('div[data-property-id-row="'+157+'"]').css("display", "none");
                $('input[name="ORDER_PROP_157"]').css("display", "none");
                //$('input[name="ORDER_PROP_157"] + br').hide();
            }
        });
        $(document).on('change', 'input[name="ORDER_PROP_144"]', function(){
            if($(this).val() == "recipient_phys") {
                $('input[name="ORDER_PROP_147"]').prop('value', '');
                $('input[name="ORDER_PROP_148"]').prop('value', '');
                $('input[name="ORDER_PROP_149"]').prop('value', '');
                $('input[name="ORDER_PROP_150"]').prop('value', '');
                $('div[data-property-id-row="'+147+'"]').css("display", "none");
                $('div[data-property-id-row="'+148+'"]').css("display", "block");
                $('div[data-property-id-row="'+149+'"]').css("display", "block");
                $('div[data-property-id-row="'+150+'"]').css("display", "block");
                $('input[name="ORDER_PROP_147"]').css("display", "none");
                $('input[name="ORDER_PROP_148"]').css("display", "block");
                $('input[name="ORDER_PROP_149"]').css("display", "block");
                $('input[name="ORDER_PROP_150"]').css("display", "block");
            }
            if($(this).val() == "recipient_jurid") {
                $('input[name="ORDER_PROP_147"]').prop('value', '');
                $('input[name="ORDER_PROP_148"]').prop('value', '');
                $('input[name="ORDER_PROP_149"]').prop('value', '');
                $('input[name="ORDER_PROP_150"]').prop('value', '');
                $('div[data-property-id-row="'+147+'"]').css("display", "block");
                $('div[data-property-id-row="'+148+'"]').css("display", "none");
                $('div[data-property-id-row="'+149+'"]').css("display", "none");
                $('div[data-property-id-row="'+150+'"]').css("display", "none");
                $('input[name="ORDER_PROP_147"]').css("display", "block");
                $('input[name="ORDER_PROP_148"]').css("display", "none");
                $('input[name="ORDER_PROP_149"]').css("display", "none");
                $('input[name="ORDER_PROP_150"]').css("display", "none");
            }
        });
        $(document).on('change', 'input[name="ORDER_PROP_151"]', function(){
            if($(this).val() == "recipient_phys") {
                $('input[name="ORDER_PROP_154"]').prop('value', '');
                $('input[name="ORDER_PROP_155"]').prop('value', '');
                $('input[name="ORDER_PROP_156"]').prop('value', '');
                $('input[name="ORDER_PROP_157"]').prop('value', '');
                $('div[data-property-id-row="'+154+'"]').css("display", "none");
                $('div[data-property-id-row="'+155+'"]').css("display", "block");
                $('div[data-property-id-row="'+156+'"]').css("display", "block");
                $('div[data-property-id-row="'+157+'"]').css("display", "block");
                $('input[name="ORDER_PROP_154"]').css("display", "none");
                $('input[name="ORDER_PROP_155"]').css("display", "block");
                $('input[name="ORDER_PROP_156"]').css("display", "block");
                $('input[name="ORDER_PROP_157"]').css("display", "block");
            }
            if($(this).val() == "recipient_jurid") {
                $('input[name="ORDER_PROP_154"]').prop('value', '');
                $('input[name="ORDER_PROP_155"]').prop('value', '');
                $('input[name="ORDER_PROP_156"]').prop('value', '');
                $('input[name="ORDER_PROP_157"]').prop('value', '');
                $('div[data-property-id-row="'+154+'"]').css("display", "block");
                $('div[data-property-id-row="'+155+'"]').css("display", "none");
                $('div[data-property-id-row="'+156+'"]').css("display", "none");
                $('div[data-property-id-row="'+157+'"]').css("display", "none");
                $('input[name="ORDER_PROP_154"]').css("display", "block");
                $('input[name="ORDER_PROP_155"]').css("display", "none");
                $('input[name="ORDER_PROP_156"]').css("display", "none");
                $('input[name="ORDER_PROP_157"]').css("display", "none");
            }
        });
    });
</script>
Ответ: Достаточно было написать условие и указать необходимые поля:
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
function ajaxResult(res)
            {
                var orderForm = BX('ORDER_FORM');
                try
                {
                    var json = JSON.parse(res);
                    BX.closeWait();
 
                    if (json.error)
                    {
                        BXFormPosting = false;
                        return;
                    }
                    else if (json.redirect)
                    {
                        window.top.location.href = json.redirect;
                    }
                }
                catch (e)
                {
                    BXFormPosting = false;
                    BX('order_form_content').innerHTML = res;
 
                    <?if(CSaleLocation::isLocationProEnabled()):?>
                        BX.saleOrderAjax.initDeferredControl();
                    <?endif?>
                }
                BX.closeWait();
                BX.onCustomEvent(orderForm, 'onAjaxSuccess');
                if ($('input[name="ORDER_PROP_151"]:checked').prop('value') == "recipient_jurid") {
                    $('div[data-property-id-row="'+154+'"]').css("display", "block");
                    $('div[data-property-id-row="'+155+'"]').css("display", "none");
                }
            }
Вопрос: Необходимо разъяснить принцип фильтрации в селекте

Фильтр по селекту, не понимаю как работает. Подскажите пожалуйста как происходит фильтрация
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
$(document).ready(function(){  
    var view=(function(){
        var structure={
            showList:function(){},
            showOption:function(){}
        };
        structure.showList=function(list, status){
            for(var i = 0; i < list.length; i++){
                if((list[i].dataset.type==status.type[0] || status.type[0]=='all') 
                    && (list[i].dataset.producer==status.producer[0] || status.producer[0]=='all') 
                    && (status.check.indexOf(list[i].dataset.bonus)!=-1 || status.check.length==0)){
                        list[i].hidden=false;
                }else{list[i].hidden=true;}
            }
        };
        structure.showOption=function(value){
            var option='<option>' + value + '</option>';
            return option;
        }; 
        return structure;
    })(); 
    var model=(function(){
        var module={
            removeStatus:function(){},
            pushStatus:function(){},
            updateFilter:function(){}
        }; 
        var select1=document.getElementById('selectType');
        var select2=document.getElementById('selectProducer');
        var checkBox=document.getElementById('check').getElementsByTagName('input');
        var list=document.getElementsByClassName('item');
        var status={
            check:[],
            type: ['all'],
            producer: ['all']
        }; 
        var loadFilter=function(){
            select1.innerHTML='<option>all</option>';
            select2.innerHTML='<option>all</option>';
            for (var i = 0; i < list.length; i++) {
                if(status.type.indexOf(list[i].dataset.type)==-1){
                    status.type.push(list[i].dataset.type);
                    select1.innerHTML+=view.showOption(list[i].dataset.type);
                }
                if(status.producer.indexOf(list[i].dataset.producer)==-1){
                    status.producer.push(list[i].dataset.producer);
                    select2.innerHTML+=view.showOption(list[i].dataset.producer);
                }
            }
        };
        loadFilter(); 
        module.updateFilter=function(){
            status.type[0]=select1.options[select1.selectedIndex].text;
            status.producer[0]=select2.options[select2.selectedIndex].text;
            view.showList(list, status); 
            var curentOption1=status.type[0];
            var curentOption2=status.producer[0]; 
            var tmpСheckbox=[]; 
            for (var i = 0; i < list.length; i++) {
                if((list[i].dataset.type==curentOption1 || curentOption1=='all') 
                    && (list[i].dataset.producer==curentOption2 || curentOption2=='all')
                    && (tmpСheckbox.indexOf(list[i].dataset.bonus)==-1)){
                    tmpСheckbox.push(list[i].dataset.bonus);
                }
            }
            for (var i = 0; i < checkBox.length; i++) {
                if(tmpСheckbox.indexOf(checkBox[i].value)==-1){checkBox[i].disabled=true;}
                else{checkBox[i].disabled=false;}
            } 
            status.type=['all'];
            status.producer=['all'];
            for (var i = 0; i < list.length; i++){
                if((list[i].dataset.type==curentOption1 || curentOption1=='all') && (status.producer.indexOf(list[i].dataset.producer)==-1) &&(status.check.indexOf(list[i].dataset.bonus)!=-1 || status.check.length==0)){status.producer.push(list[i].dataset.producer);}
                if((list[i].dataset.producer==curentOption2 || curentOption2=='all') && (status.type.indexOf(list[i].dataset.type)==-1) && (status.check.indexOf(list[i].dataset.bonus)!=-1 || status.check.length==0)){status.type.push(list[i].dataset.type);}
            } 
            select1.innerHTML='';
            for ( i = 0; i < status.type.length; i++) {
                select1.innerHTML+='<option>'+status.type[i]+'</option>';
                if(select1.options[i].text==curentOption1){var curentIndex=i;}//текущий индекс
            } 
            //возвращает Порядковый номер выбранного параметра или первого выбранного варианта в списке выбора
            select1.selectedIndex=curentIndex; 
            select2.innerHTML='';
            for ( i = 0; i < status.producer.length; i++) {
                select2.innerHTML+='<option>'+status.producer[i]+'</option>';
                if(select2.options[i].text==curentOption2){curentIndex=i;} 
            }
            select2.selectedIndex=curentIndex; 
            var selectedCheck=0;
            var selectedDisableCheck=0;
            for (var i = 0; i < checkBox.length; i++) {
                if(checkBox[i].checked==true){
                    selectedCheck++;
                    if(checkBox[i].disabled==true){electedDisableCheck++;}
                }
            } 
            if(selectedCheck==selectedDisableCheck && selectedCheck!=0){
                select2.selectedIndex=0;
                select1.selectedIndex=0;
                for (var i = 0; i < checkBox.length; i++) {checkBox[i].disabled=false;}
                select1
                view.showList(list, status);
            } 
        }; 
        module.pushStatus=function(val){status.check.push(val);}
        module.removeStatus=function(val){status.check.splice(status.check.indexOf(val),1);}  
        return module;
    })();
    model.updateFilter();
    var form = document.getElementById('form');
    form.onchange=function (e) {
        if(e.target.tagName == 'SELECT'){model.updateFilter();}
        if(e.target.tagName == 'INPUT' ){
            if(e.target.checked){model.pushStatus(e.target.value);}
            else{model.removeStatus(e.target.value);}
            model.updateFilter();   
        }
    }   
});
HTML5
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
<section class="main_block_service"> 
            <div class="container">
                 
                 <form id="form">
                    <div id="check">
                        <label class="checkbox">Красный
                            <input type="checkbox" value="Photography">
                        </label>
                        <label class="checkbox">Зеленый
                            <input type="checkbox" value="Web_Design">
                        </label>
                        <label class="checkbox">Синий
                            <input type="checkbox" value="Digital">
                        </label>
                        <label class="checkbox">Желтый
                            <input type="checkbox" value="Creativity">
                        </label>
                        <label class="checkbox">Коричневый
                            <input type="checkbox" value="Seo">
                        </label>
                        <label class="checkbox">Фиолетовый
                            <input type="checkbox" value="Css_Html">
                        </label>
                    </div>
                    <div class="selects">
                        <select id="selectType" name=""></select>
                        <select id="selectProducer" name=""></select>
                    </div>
                 </form>           
                <div class="block_service">
                    <div data-type="Машины" data-producer="Красный" class="item info_service categorya" data-bonus="Photography">
                        <div class="icon_serv_1"></div>
                        <div class="text-info_serv red">
                            Красный
                            <span>
                               <img class="img" src="img/00001-390.jpg"> 
                            </span>
                        </div>
                    </div>
                    <div class="item info_service categorya"  data-type="Природа" data-producer="Зеленый" data-bonus="Web_Design">
                        <div class="icon_serv_2"></div>
                        <div class="text-info_serv green">
                            Зеленый
                            <span>
                                 <img class="img" src="img/i.jpg">
                            </span>
                        </div>
                    </div>
                    <div data-type="Природа" data-producer="Желтый" class="item info_service categoryb" data-bonus="Digital">
                        <div class="icon_serv_6"></div>
                        <div class="text-info_serv blue">
                            Синий
                            <span>
                              <img class="img" src="img/8TA6Xoqzc.jpg">
                            </span>
                        </div>
                    </div>  
                </div>  
                <div class="block_service">
                    <div data-type="Яблоко" data-producer="Красный" class="item info_service categorya" data-bonus="Web_Design">
                        <div class="icon_serv_2"></div>
                        <div class="text-info_serv green">
                            Зеленый
                            <span>
                                <img class="img" src="img/i (1).jpg">
                            </span>
                        </div>
                    </div>
                    <div data-type="Машины" data-producer="Голубой" class="item info_service categorya" data-bonus="Photography">
                        <div class="icon_serv_1"></div>
                        <div class="text-info_serv red">
                            Красный
                            <span>
                                 <img class="img" src="img/lamborghini_PNG10691.png">  
                            </span>
                        </div>
                    </div>
                    <div  data-type="Машины" data-producer="Зеленый" class="item info_service categorya" data-bonus="Creativity">
                        <div class="icon_serv_3"></div>
                        <div class="text-info_serv yellow">
                            Желтый
                            <span>
                                <img class="img" src="img/ccs-2534-092578100 1324556068_thumb.jpg">
                            </span>
                        </div>
                    </div>  
                </div> 
                <div class="block_service">
                    <div data-type="Яблоко" data-producer="Желтый" class="item info_service categoryb" data-bonus="Seo">
                        <div class="icon_serv_4"></div>
                        <div class="text-info_serv brown">
                            Коричневый
                            <span>
                                <img class="img" src="img/886104bdc1d9c70631709b8b49ce3a93.jpeg">
                            </span>
                        </div>
                    </div>
                    <div data-type="Яблоко" data-producer="Зеленый" class="item info_service categoryb" data-bonus="Css_Html">
                        <div class="icon_serv_5"></div>
                        <div class="text-info_serv blueviolet">
                            Фиолетовый
                            <span>
                                <img class="img" src="img/fd81218eff0cf341ae53c7b6c95b0448.jpg">
                            </span>
                        </div>
                    </div>
                    <div data-type="Машины" data-producer="Желтый" class="item info_service categoryb" data-bonus="Digital">
                        <div class="icon_serv_6"></div>
                        <div class="text-info_serv blue">
                            Синий
                            <span>
                                <img class="img" src="img/fb149c4bc55b120dbdaed1400c9c683c_i-134.jpg">
                            </span>
                        </div>
                    </div>  
                </div>
                <div class="block_service">
                    <div data-type="Природа" data-producer="Голубой" class="item info_service categoryb" data-bonus="Css_Html">
                        <div class="icon_serv_5"></div>
                        <div class="text-info_serv blueviolet">
                            Фиолетовый
                            <span>
                                <img class="img" src="img/fon-nebo4-1.jpg">
                            </span>
                        </div>
                    </div>
                    <div data-type="Цветы" data-producer="Желтый" class="item info_service categoryb" data-bonus="Seo">
                        <div class="icon_serv_4"></div>
                        <div class="text-info_serv brown">
                            Коричневый
                            <span>
                                <img class="img" src="img/gerbera_flower_yellow_white_background.jpg">
                            </span>
                        </div>
                    </div> 
                    <div data-type="Цветы" data-producer="Красный" class="item info_service categorya" data-bonus="Creativity">
                        <div class="icon_serv_3"></div>
                        <div class="text-info_serv yellow">
                            Желтый
                            <span>
                                <img class="img" src="img/efff1a8d116dc6e82c0305f918d96cc9.jpg">
                            </span>
                        </div>
                    </div> 
                </div>
            </div>  
        </section>
Добавлено через 7 часов 56 минут
Помогите пожалуйста(
Ответ:
Сообщение от vfifgfif
Помогите пожалуйста(
Ну так начните комментировать код построчно, там ясно станет.
Давайте я за вас начну, а дальше вы уж сами?
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
// документ загружен
$(document).ready(function() {
  // шаблон MVC видимо
  // тут V - view: представление
  var view = (function() {
    // объявление структуры с пустыми функциями здесь - overhead
    var structure = {
      showList: function() {},
      showOption: function() {}
    };
 
    structure.showList = function(list, status) {
      // пройтись по элементам list
      for (var i = 0; i < list.length; i++) {
        // если *хитрое условие*
        // TODO: extract conditions to functions
        // TODO: refactor smell code: if(true) a = true; else a = false;
        if ((list[i].dataset.type == status.type[0] || status.type[0] == 'all') &&
          (list[i].dataset.producer == status.producer[0] || status.producer[0] == 'all') &&
          (status.check.indexOf(list[i].dataset.bonus) != -1 || status.check.length == 0)) {
            // элемент списка показать
          list[i].hidden = false;
        } else {
          // иначе скрыть
          list[i].hidden = true;
        }
      }
    };
 
    structure.showOption = function (value) {
      var option = '<option>' + value + '</option>';
      return option;
    };
 
    return structure;
  })();
 
  // шаблон MVC
  // тут М - Model: модель
  var model = (function () {
    var module = {
      removeStatus: function() {},
      pushStatus: function() {},
      updateFilter: function() {}
    };
    // Э... по-идее элементам DOM место не тут, а в представлении
    var select1 = document.getElementById('selectType');
    var select2 = document.getElementById('selectProducer');
    var checkBox = document.getElementById('check').getElementsByTagName('input');
    var list = document.getElementsByClassName('item');
    var status = {
      check: [],
      type: ['all'],
      producer: ['all']
    };
 
    // Задать начальные сначение опций select`ов
    var loadFilter = function() {
      select1.innerHTML = '<option>all</option>';
      select2.innerHTML = '<option>all</option>';
      for (var i = 0; i < list.length; i++) {
        // Заполнить первый select
        // если в массиве status.type нет значения атрибута `data-type`
        // текущего элемента списка, то добавить это значение в массив
        // и добавить опцию к select
        if (status.type.indexOf(list[i].dataset.type) == -1) {
          status.type.push(list[i].dataset.type);
          select1.innerHTML += view.showOption(list[i].dataset.type);
        }
 
        // Аналогично первому условию, только проверяется атрибут `data-producer`
        if (status.producer.indexOf(list[i].dataset.producer) == -1) {
          status.producer.push(list[i].dataset.producer);
          select2.innerHTML += view.showOption(list[i].dataset.producer);
        }
      }
    };
    loadFilter();
 
    module.updateFilter = function() {
      // задать первый элемент массива `status.type` текстом выбранной опции
      // первого select
      status.type[0] = select1.options[select1.selectedIndex].text;
      // задать первый элемент массива `status.producer` текстом выбранной опции
      // второго select
      status.producer[0] = select2.options[select2.selectedIndex].text;
      // изменить видимость элементов списка согласно *хитрое условие*
      view.showList(list, status);
 
      // Ну и так далее...
Вопрос: Работа с сессией и авторизацией

Здравтсвуйте, у меня возникла проблема срочно пожалуйста помогите (очень быстро), создал свой сайт, теперь при обновлении страницы у меня снова появляется окно с авторизацией. Как мне написать код, чтобы я авторизировался, и при переходе на другую страницу окно сохранялось ( окно с именем текущего пользователя ), чтобы не вводить 200 раз логин и пароль.

Добавлено через 1 минуту
<?php

$dbconnect = @mysql_connect ('mysql.hostinger.ru', 'u995697104_popov', 'Jx18XDGtNvLfNq6tYGS');
if (!$dbconnect) { echo ("Не могу подключиться к серверу базы данных!"); }
if(@mysql_select_db('u995697104_bd1')) {}
else die ("Не могу подключиться к базе данных!");


$q = mysql_query('SET NAMES cp1251');



if($_REQUEST['close'])
{
setcookie('id', '', time() - 60*60*24*30, '/');
setcookie('hash', '', time() - 60*60*24*30, '/');
header('Location: index.php'); exit();
}
if (isset($_POST['Addnews']))
{
$information = $_POST['information'];
$id = $_POST['id'];
mysql_connect('mysql.hostinger.ru','u995697104_popov','Jx18XDGtNvLfNq6tYGS') or die(mysql_error());
mysql_select_db('News');
if(mysql_query("INSERT INTO `News` (`id` , `text`) VALUES ('$id','$information')"))
{ echo 'Данные успешно занесены';
echo "<script>window.location.href='index.php'</script>";
}
else
{
echo 'Произошла ошибка занесения данных в базу';
}

}
$result = mysql_query(' SELECT * FROM News');
if (isset($_POST['button3']))
{
mysqli_connect('mysql.hostinger.ru','u995697104_popov','Jx18XDGtNvLfNq6tYGS') or die(mysql_error());
mysql_select_db('News');
$idnewsrd = $_POST['idnewsrd'];
$rd = mysql_query("SELECT * from News WHERE id = '$idnewsrd'");
$row1 = mysql_fetch_assoc($rd);


}
function avtor()
{echo '<div class="test">
<form method="post" action="index.php" id="form3">
<br><center><font color="red">Авторизация</font></center>
<center><input type = "text" name = "login" placeholder="Логин" style="width:100;">
<br><br>
<input type = "password" name = "password" placeholder="Пароль" style="width:100;">
<br><br>
<input type = "submit" name = "open" value="ВОЙТИ" style="width:100;" /><br>
</form>
<form method="post" action="Регистрация.php" id="form2"><br>
<input type = "submit" name = "registration" value="Регистрация" style="width:100;" onClick="javascript:window.location=`Регистрация.php`"/><br><br>
</form>
</center>

</div>';}
$filter = array("<", ">","="," (",")",";","/");
if($result)
{echo '<center><table style="margin-top:1000; width: 70%;" border="4" >';
while($row = mysql_fetch_array($result))
{
echo '<tr><td>'.$row['text'].'</td></tr>'; //выводим
}
echo '<tr><td>';
function formauser()
{echo '<center><img src="rules.png" style="width:30;height:30"><input name="plus" type="button" value="Показать форму" onclick = "javascript:window.location=`Бан.php`"/></center><br><br><br>';}

function forma()
{echo '<img src="rules.png" style="width:30;height:30"><input name="plus" type="button" value="Показать форму" onclick = "disp(document.getElementById(\'form1\')); if (this.value == \'Показать форму\') this.value = \'Скрыть форму\'; else this.value = \'Показать форму\';" /><br><br><br>';}

function panel() {echo '<center><div style="left:10%; width:80%;"><font color="red" size="4"><hr><center><i>Панель администратора<br>&nbsp; </i></center></font>';}
session_start();
$q = mysql_query('SET NAMES utf8');

$q = mysql_query("select * from Users");
$f = mysql_fetch_array($q);
$login = $_POST['login'];
$password = $_POST['password'];

avtor();
function Ulogin($p1)
{if ($p1 <=0 and $_SESSION['USER_LOGIN_IN'] != $p1) avtor();}
if (isset($_POST['open']))
{if (empty($_POST['login']))
{echo 'Введите логин!';
echo '<div id="parent_popup">
<div id="popup">
<center>Ошибка авторизации!!!Заполните поле логин!!!<br>
<p>Авторизируйтесь или зарегистрируйтесь!!!</p>
<a href="index.php"><img src="Админка/Отмена.png" class=img1></a><br><br><br>
<a href="Регистрация.php"><img src="Админка/Регистрация.png" class=img1></a><br>
</center>
</div>
</div>';}
else {if (empty($_POST['password']))
{echo 'Введите Пароль!';
echo '<div id="parent_popup">
<div id="popup">
<center>
Ошибка авторизации!!!Заполните поле пароль!!!<br>
<p>Авторизируйтесь или зарегистрируйтесь!!!</p>
<a href="index.php"><img src="Админка/Отмена.png" class=img1></a> <br><br><br>
<a href="Регистрация.php"><img src="Админка/Регистрация.png" class=img1></a><br>
</center>
</div>
</div>';}
else {
$query = mysql_query("SELECT * from Users WHERE Login = '$login'");
$myrow = mysql_fetch_array($query);
if ($login == $myrow['Login'])
{if ($password == $myrow['Password'])
{$_SESSION['Name'] = $myrow['Name'];
$_SESSION['Fam'] = $myrow['Fam'];
$_SESSION['Middle'] = $myrow['Middle'];
$_SESSION['Login'] = $login;
$_SESSION['Password'] = $myrow['Password'];
$_SESSION['E-mail'] = $myrow['Email'];
$_SESSION['Year'] = $myrow['Year'];
$_SESSION['Type'] = $myrow['Type'];
$_SESSION['USER_LOGIN_IN'] = 1;

echo '<div class=test><center><font color="red">Добро пожаловать, '.$login.'</font><hr><br>
<form method="post" action="index.php"><input type = "submit" name = "close" value="Выход" style="width:100;" /></form>
<br> <a href="">Личный кабинет</a><br>
<a href="">Мои темы</a><br>
<a href="">Мои сообщения</a><br>
</center>

</div>'; if ($login == 'Administrator') {


panel();
echo '<form method="post" action="index.php" class = "megaform" id="form1"><center><table border="4" style="
color: beige;border-color:green;
" id="Newsadmin">
<tr>
<td id="leftcol"><center><font color="yellow" size="5">Отредактировать новость</font><br><br>Id новости <input name="idnewsrd"> </input><br>
<br>Информация<br><textarea name="redactor">'.$row1['text'].'</textarea><br><br>
<input type = "submit" name = "button3" value = "Вывести информацию"><br><br>
<input type = "submit" name = "btn" value = "Обновить страницу">
<br><br>
<input type = "submit" name = "button1" value = "Сохранить изменения"><br></center> </td>
<td id="rightcol"><center>Id номер новости <input name="delete"> </input><br><br><input type = "submit" name = "button2" value = "Удалить новость"></center></td>
</tr>
<tr><td colspan=2><center><font color="yellow" size="5">Добавить новость</font>
<br><br>Информация <br>
<textarea name="information"> </textarea> <br><br> <input type = "submit" name = "Addnews" value = "Добавить"> <br><br>
Номер новости <input name="id"> </input> <br> <br>

<input type = "button" value = "Перейти в админку управления" onClick="javascript:window.location=`Админка.php`" />
</center></td></tr>
</table></center>

</form>'; forma();
}
else {
if ($_SESSION['Type'] == 'User')
{panel();formauser();}
}
}
else {echo '<div id="parent_popup">
<div id="popup">
<center>
Ошибка авторизации!!!Неверный логин или пароль!!!<br><br>
<a href="index.php"><img src="Админка/Отмена.png" class=img1></a> <br><br><br>
<a href="Регистрация.php"><img src="Админка/Регистрация.png" class=img1></a><br>
</center>
</div>
</div>';}
}
else {echo '<div id="parent_popup">
<div id="popup">
<center>
Ошибка авторизации!!!Неверный логин или пароль!!!<br> <br>
<a href="index.php"><img src="Админка/Отмена.png" class=img1></a> <br><br><br>
<a href="Регистрация.php"><img src="Админка/Регистрация.png" class=img1></a><br>
</center>
</div>
</div>';}

}
}
}


//else {echo '<center><img src="rules.png" style="width:30;height:30"><input name="plus" type="button" value="Показать форму" onclick = "javascript:window.location=`Бан.php`" /></center>';}


echo
'</td></tr>';
echo '</table></center><center><p align="top"><font color="red">РАЗРАБОТАЛ: </font><a href="https://vk.com/id222395190" style="color:blue">Попов Виталий</a></p></center></div></center>';
}



if (isset($_POST['btn']))
{ echo "<script>window.location.href='index.php'</script>"; }

if (isset($_POST['button1']))
{
mysqli_connect('mysql.hostinger.ru','u995697104_popov','Jx18XDGtNvLfNq6tYGS') or die(mysql_error());
mysql_select_db('News');
$idnewsrd1 = $_POST['idnewsrd'];
$row2 = $_POST['redactor'];
$result1 = MYSQL_QUERY("UPDATE `News` SET `text` = '$row2' WHERE id = '$idnewsrd1'");
if ($result1)
{echo 'Данные успешно отредактированы';
echo "<script>window.location.href='index.php'</script>";
}
else {echo 'Не получилось сохранить данные, повторите попытку!Не забывайте вводить id новости, это очень важно!';}
}

if (isset($_POST['button2']))
{
mysqli_connect('mysql.hostinger.ru','u995697104_popov','Jx18XDGtNvLfNq6tYGS') or die(mysql_error());
mysql_select_db('News');
$del = $_POST['delete'];
$result2 = MYSQL_QUERY("DELETE FROM `News` WHERE id = '$del'");
if ($result2)
{echo "<script>window.location.href='index.php'</script>";
echo 'Данные успешно удалены';}
else {echo 'Удалить данные не получилось!';}
}
?>
Ответ: вот вторая страница

<?php
$dbconnect = @mysql_connect ('mysql.hostinger.ru', 'u995697104_popov', 'Jx18XDGtNvLfNq6tYGS');
if (!$dbconnect) { echo ("Не могу подключиться к серверу базы данных!"); }
if(@mysql_select_db('u995697104_bd1')) {}
else die ("Не могу подключиться к базе данных!");


$q = mysql_query('SET NAMES cp1251');



if (isset($_POST['Addnews']))
{
$information = $_POST['information'];
$id = $_POST['id'];
mysqlI_connect('mysql.hostinger.ru','u995697104_popov','Jx18XDGtNvLfNq6tYGS') or die(mysql_error());
mysql_select_db('Antivirusniki');
if(mysql_query("INSERT INTO `Antivirusniki` (`id` , `Name`) VALUES ('$id','$information')"))
{ echo 'Данные успешно занесены';
echo "<script>window.location.href='Антивирусники.php'</script>";
}
else
{
echo 'Произошла ошибка занесения данных в базу';
}

}
$result = mysql_query(' SELECT * FROM Antivirusniki');


if (isset($_POST['button3']))
{
mysqlI_connect('mysql.hostinger.ru','u995697104_popov','Jx18XDGtNvLfNq6tYGS') or die(mysql_error());
mysql_select_db('Antivirusniki');
$idnewsrd = $_POST['idnewsrd'];
$rd = mysql_query("SELECT * from Antivirusniki WHERE id = '$idnewsrd'");
$row1 = mysql_fetch_assoc($rd);
}
function avtor()
{echo '<div class="test">
<form method="post" action="Антивирусники.php" id="form3">
<br><center><font color="red">Авторизация</font></center>
<center><input type = "text" name = "login" placeholder="Логин" style="width:100;">
<br><br>
<input type = "password" name = "password" placeholder="Пароль" style="width:100;">
<br><br>
<input type = "submit" name = "open" value="ВОЙТИ" style="width:100;" /><br>
</form>
<form method="post" action="Регистрация.php" id="form2"><br>
<input type = "submit" name = "registration" value="Регистрация" style="width:100;" onClick="javascript:window.location=`Регистрация.php`"/><br><br>
</form>
</center>

</div>';}
if($result) {echo '<center><table style="margin-top:700;width:80%;" border="1" >';
while($row = mysql_fetch_array($result))
{ echo '<tr><td>'.$row['Name'].'</td></tr>'; }
echo '<tr><td>
';



function forma()
{echo '<img src="rules.png" style="width:30;height:30"><input name="plus" type="button" value="Показать форму" onclick = "disp(document.getElementById(\'form1\')); if (this.value == \'Показать форму\') this.value = \'Скрыть форму\'; else this.value = \'Показать форму\';" /><br><br><br>';}

session_start();
$q = mysql_query('SET NAMES utf8');

$q = mysql_query("select * from Users");
$f = mysql_fetch_array($q);
$login = $_POST['login'];
$password = $_POST['password'];
$_SESSION['Login'] = $login;
avtor();
if (isset($_POST['open']))
{if (empty($_POST['login']))
{echo 'Введите логин!';
echo '<div id="parent_popup">
<div id="popup">
<center>Ошибка авторизации!!!Заполните поле логин!!!<br>
<p>Авторизируйтесь или зарегистрируйтесь!!!</p>
<a href="Антивирусники.php"><img src="Админка/Отмена.png" class=img1></a><br><br><br>
<a href="Регистрация.php"><img src="Админка/Регистрация.png" class=img1></a><br>
</center>
</div>
</div>';}
else {if (empty($_POST['password']))
{echo 'Введите Пароль!';
echo '<div id="parent_popup">
<div id="popup">
<center>
Ошибка авторизации!!!Заполните поле пароль!!!<br>
<p>Авторизируйтесь или зарегистрируйтесь!!!</p>
<a href="Антивирусники.php"><img src="Админка/Отмена.png" class=img1></a> <br><br><br>
<a href="Регистрация.php"><img src="Админка/Регистрация.png" class=img1></a><br>
</center>
</div>
</div>';}
else {
$query = mysql_query("SELECT * from Users WHERE Login = '$login'");
$myrow = mysql_fetch_array($query);
if ($login == $myrow['Login'])
{if ($password == $myrow['Password'])
{$_SESSION['Login'] = $login;
echo '<div class=test><center><font color="red">Добро пожаловать, '.$login.'</font><hr><br>
<form method="post" action="Антивирусники.php"><input type = "submit" name = "close" value="Выход" style="width:100;" /></form>
<br> <a href="">Личный кабинет</a><br>
<a href="">Мои темы</a><br>
<a href="">Мои сообщения</a><br>
</center>

</div>'; if ($login == 'Administrator') {

echo '<center><div style="left:10%; width:80%;"><font color="red" size="4"><hr><center><i>Панель администратора<br>&nbsp; </i></center></font>';

echo '<form method="post" action="Антивирусники.php" class = "megaform" id="form1"><center><table border="4" style="
color: beige;border-color:green;
" id="Newsadmin">
<tr>
<td id="leftcol"><center><font color="yellow" size="5">Отредактировать новость</font><br><br>Id новости <input name="idnewsrd"> </input><br>
<br>Информация<br><textarea name="redactor">'.$row1['Name'].'</textarea><br><br>
<input type = "submit" name = "button3" value = "Вывести информацию"><br><br>
<input type = "submit" name = "btn" value = "Обновить страницу">
<br><br>
<input type = "submit" name = "button1" value = "Сохранить изменения"><br></center> </td>
<td id="rightcol"><center>Id номер новости <input name="delete"> </input><br><br><input type = "submit" name = "button2" value = "Удалить новость"></center></td>
</tr>
<tr><td colspan=2><center><font color="yellow" size="5">Добавить новость</font>
<br><br>Информация <br>
<textarea name="information"> </textarea> <br><br> <input type = "submit" name = "Addnews" value = "Добавить"> <br><br>
Номер новости <input name="id"> </input> <br> <br>

<input type = "button" value = "Перейти в админку управления" onClick="javascript:window.location=`Админка.php`" />
</center></td></tr>
</table></center>

</form>'; forma();
} }
else {echo '<div id="parent_popup">
<div id="popup">
<center>
Ошибка авторизации!!!Неверный логин или пароль!!!<br><br>
<a href="index.php"><img src="Админка/Отмена.png" class=img1></a> <br><br><br>
<a href="Регистрация.php"><img src="Админка/Регистрация.png" class=img1></a><br>
</center>
</div>
</div>';}
}
else {echo '<div id="parent_popup">
<div id="popup">
<center>
Ошибка авторизации!!!Неверный логин или пароль!!!<br> <br>
<a href="index.php"><img src="Админка/Отмена.png" class=img1></a> <br><br><br>
<a href="Регистрация.php"><img src="Админка/Регистрация.png" class=img1></a><br>
</center>
</div>
</div>';}

}
}
}





echo '</td></tr>';

echo
'</td></tr>';
echo '</table></center><center><p align="top"><font color="red">РАЗРАБОТАЛ: </font><a href="https://vk.com/id222395190" style="color:blue">Попов Виталий</a></p></center></div></center>'; }
//<input name="plus" type="button" value="Показать форму" onclick = "disp(document.getElementById(\'form1\')); if (this.value == \'Показать форму\') this.value = \'Скрыть форму\'; else this.value = \'Показать форму\';" />

if (isset($_POST['btn']))
{ echo "<script>window.location.href='Антивирусники.php'</script>"; }

if (isset($_POST['button1']))
{
mysqli_connect('mysql.hostinger.ru','u995697104_popov','Jx18XDGtNvLfNq6tYGS') or die(mysql_error());
mysql_select_db('Antivirusniki');
$idnewsrd1 = $_POST['idnewsrd'];
$row2 = $_POST['redactor'];
$result1 = MYSQL_QUERY("UPDATE `Antivirusniki` SET `Name` = '$row2' WHERE id = '$idnewsrd1'");
if ($result1)
{echo 'Данные успешно отредактированы';
echo "<script>window.location.href='Антивирусники.php'</script>";
}
else {echo 'Не получилось сохранить данные, повторите попытку!Не забывайте вводить id новости, это очень важно!';}
}

if (isset($_POST['button2']))
{
mysqlI_connect('mysql.hostinger.ru','u995697104_popov','Jx18XDGtNvLfNq6tYGS') or die(mysql_error());
mysql_select_db('Antivirusniki');
$del = $_POST['delete'];
$result2 = MYSQL_QUERY("DELETE FROM `Antivirusniki` WHERE id = '$del'");
if ($result2)
{echo "<script>window.location.href='Антивирусники.php'</script>";
echo 'Данные успешно удалены';}
else {echo 'Удалить данные не получилось!';}
}
?>

Добавлено через 1 минуту
Например, я авторизировался на странице index.php, потом перехожу на другую страницу, сессия слетает и появляется окно авторизации, как мне написать код?
Вопрос: Растягивание выпадающего меню на всю страницу

Добрый день! Столкнулся со следующей проблемой: помещенное в header выпадающее меню не растягивается на всю ширину экрана, несмотря на прописанный width:100%. Вдобавок, пока не разобрался, как сделать само выпадание (скрыть вложенные меню и заскриптовать вывод при наведении). Пожалуйста, подскажите, в чем проблема?(P.S. Я недавно начал изучать HTML, потому прошу не бить ногами сразу)
HTML5
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
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
<!DOCTYPE html>
<html>
<head>
 
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
 
<meta charset="utf-8" />
 
<title>ЗАО "Электроник-Сервис"</title>
 
<style>
* {
 margin: 0;
 padding: 0;
}
 
body {
 width: 100%;
 height: 100%;
 color:#333;
background-image:url(images/bg.png);
 font-family: "Segoe UI", "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, sans-serif;
 font-size:0.94em;
 line-height:135%;
 
}
 
aside, nav, footer, header, section { display: block; }
 
ul {
 list-style:none;
}
 
a {
 text-decoration:none;
}
 
a:hover {
 text-decoration: none;
}
 
 
 
.header{
 width:100%;
 background: #b1fab1;
 height:75px;
 z-index: 4;
 }
 
#headerInner {
 
 position:relative;
 border:0px solid #333;
 width:1200px;
 height:250px;
 margin:0 auto;
 margin-top:0px;
 }
 
 
 #footer {
 margin-top:1200px;
 height:75px;
 width:100%;
 background: #000000;
 }
 
 
}
 #wrapper {
 margin-top:40px;
 width: 1200px;
 margin: 0 auto;
 height: auto !important;
 }
 
 #content #colLeft {
 background: #fff;
 float:left;
 width:800px;
 margin-right:0px;
 }
 
#content #colRight {
 margin-left:45px;
 float:left;
 width:350px;
 position:relative;
}
 
#middle:after {
 content: '.';
 display: block;
 clear: both;
 visibility: hidden;
 height: 0;
}
 
 
 
/*----------------------------
 Логотип
------------------------------*/
 
.logo {
 position:absolute;
 left:0px;
 top:6px;
 }
 
 
 .bottomMenu {
 width:100%;
 /*----------------------------
 Разобраться, как (и нужно ли?) растянуть на весь экран 
------------------------------*/
 height: 70px;
 position:relative;
 left:0px;
 bottom:0px;
 
 background: url(images/bgmenu.png) 0px 0px repeat-x;
 }
 
#dropdown_nav {
 font-weight:bold;
 display:inline-block;
 list-style:none;
 border-bottom:0px solid #777;
 margin-top:18px;
 }
 
#dropdown_nav li {
 float:left;
 position:relative;
 display:inline-block;
 
 }
 
#dropdown_nav li a {
 
 font-weight:100;
 font-size:18px;
 color:#fff;
 padding:15px 22px 20px 22px;
 background: url(images/linemenu.png) right no-repeat;
 -moz-transition: background-color 0.3s 0.01s ease;
 -o-transition: background-color 0.3s 0.01s ease;
 -webkit-transition: background-color 0.3s 0.01s ease;
 }
 #dropdown_nav li a:hover {
 background: #000;
 text-decoration:none;
 color:#0dbfe5;
 }
 
 #dropdown_nav li a.first {
 -moz-border-radius:5px 0px 0px 5px;
 -webkit-border-radius:5px 0px 0px 5px;
 }
 
/* Выпадающее меню */
 #dropdown_nav .sub_nav {
 z-index: 4;
 width:180px;
 padding:0px;
 position:absolute;
 top:42px;
 left:0px;
 border:0px solid #ddd;
 border-top:none;
 background: #000;
 }
 
#dropdown_nav .sub_nav li {
 
 width:180px;
 padding:0px;
 }
 
#dropdown_nav .sub_nav li a {
 background: none;
 font-weight: normal;
 font-size:15px;
 display:block;
 border-bottom:0px solid #e5e0b3;
 padding-left:10px;
 color:#fff;
 
 }
 #dropdown_nav .sub_nav li a:hover {
 background:#222;
 color:#0dbfe5;
 }
 
</style>
 
    
 
 
</head>
<body>
 
<!-- Начало хидер -->
<header class="header">
<div id="headerInner">
 
 
 
 <span style="float:right;  padding:10px 20px 0px 10px;" >
<img src="images/tel.png" height="28"/> <span style="vertical-align:super;  font-family:Franklin Gothic Medium; font-size:1.2em; " >  <font color="#1ca0a2">(4012) 21-16-00 </font> </span> <br>
 <img src="images/fax.png" height="28"/>  <span style="vertical-align:super; font-family:Franklin Gothic Medium; font-size:1.2em"> <font color="#1ca0a2"> (4012) 91-61-25 </font> </span> 
 
<div class="logo">
<a href="#"><img src="images/logo.png" height="65" /></a>
 
<!-- Начало #bottomMenu -->
 <nav class="bottomMenu">
<ul id="dropdown_nav">
 
 <li><a href="#">Планшеты\смартфоны</a>
 <ul class="sub_nav">
 <li><a href="#">122</a></li>
 <li><a href="#">Подменю #2</a></li>
 <li><a href="#">Подменю #3</a></li>
 <li><a href="#">Подменю #4</a></li>
 </ul>
<li><a href="#">ПК и ноутбуки</a>
<ul class="sub_nav">
 <li><a href="#">Подменю #1</a></li>
 <li><a href="#">Подменю #2</a></li>
 <li><a href="#">Подменю #3</a></li>
 <li><a href="#">Подменю #4</a></li>
 </ul>
<li><a href="#">Комплектующие</a>
<ul class="sub_nav">
 <li><a href="#">Подменю #1</a></li>
 <li><a href="#">Подменю #2</a></li>
 <li><a href="#">Подменю #3</a></li>
 <li><a href="#">Подменю #4</a></li>
 </ul>
<li><a href="#">Периферия</a>
<ul class="sub_nav">
 <li><a href="#">Подменю #1</a></li>
 <li><a href="#">Подменю #2</a></li>
 <li><a href="#">Подменю #3</a></li>
 <li><a href="#">Подменю #4</a></li>
 </ul>
<li><a href="#">Услуги</a>
<ul class="sub_nav">
 <li><a href="#">Подменю #1</a></li>
 <li><a href="#">Подменю #2</a></li>
 <li><a href="#">Подменю #3</a></li>
 <li><a href="#">Подменю #4</a></li>
 </ul>
<li><a href="#">Контакты</a>
<ul class="sub_nav">
 <li><a href="#">Подменю #1</a></li>
 <li><a href="#">Подменю #2</a></li>
 <li><a href="#">Подменю #3</a></li>
 <li><a href="#">Подменю #4</a></li>
 </ul>
 
 </ul>
 </nav><!-- конец #bottomMenu -->
</div>
 
 
</div>
</header><!-- Конец хидер -->
 
<!-- начало врапер -->
 
<section id="wrapper">
<div id="middle">
<div id="content">
<div id="colLeft">
 
</div><!-- Конец коллефт -->
 
<aside id="colRight">
 
</aside><!-- Конец колрайт -->
 
</div><!-- Конец контент -->
</div><!-- Конец мидл -->
</section><!-- Конец врапер -->
 
<!-- Начало футер -->
 
<footer id="footer">
<a href="#"><img src="images/logo.png" height="65"  style="padding:6px 20px 0px 70px;" /></a>
<span style="float:right;  padding:10px 75px 0px 10px;" >
<img src="images/tel.png" height="28"/> <span style="vertical-align:super;  font-family:Franklin Gothic Medium; font-size:1.2em; " >  <font color="#1ca0a2">(4012) 21-16-00 </font> </span> <br>
 <img src="images/fax.png" height="28"/>  <span style="vertical-align:super; font-family:Franklin Gothic Medium; font-size:1.2em"> <font color="#1ca0a2"> (4012) 91-61-25 </font> </span> 
 
</span>
<div id="footerInner">
 
</div><!-- Конец футериннер -->
</footer><!-- Конец футер -->
 
</body>
</html>
Ответ:
CSS
1
#headerInner{width:1200px}
ограничен по ширине соответственно вложенное в него меню не будет растянуто на 100% ширины страницы... Это, то что касается меню... Выпадашку при наведении можно найти на форуме, воспользовавшись , их здесь уйма и на любой вкус...
Вопрос: Высота элементов li

Привет всем)
сижу, изучаю css, html, верстал макет из PSD файла. В общем там картинки располагаются интересным методом(скрин прилогается). Я эти картинки начал запихивать списками. Запихал- встали нормально. Но у них есть эффект при наведении(затеняется фон, и появляются разные надписи. Скрин есть). Я это дело делал след. образом:
в нутри каждого li создал блок over_block, сделал ему стилистику подходящуу и скрыл opacity 0. И при наведении на любой из пунктов li у того блока opacity становится равным 0.8. Все хорошо, но вот только картинки разной высоты, а содержимое блока почему то под эту разную высоту не адаптируется, хотя все в процентах задал. Что я делаю не так? Гуру и просто кто понимает направьте на путь истинный )))
HTML5
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
<ul class="content">
                                        <li><a href="#"><img src="http://www.cyberforum.ru/images/one-one.png" alt=""></a>
                                        <div class="over_block">
                                        <a href="#"><p class="title">title here</p></a>
                                        <p class="sub-title">At vero eos et accusamus et<br> iusto odio dignissimos ducimus <br>qui blanditiis praesentium</p>
                                        <div class="icons">
                                            <a href="#"><img src="http://www.cyberforum.ru/images/link-ic.png" alt=""></a>
                                            <a href="#"><img src="http://www.cyberforum.ru/images/like-inc.png" alt=""></a></div>
                                        </div></li>
                                        <li><a href="#"><img src="http://www.cyberforum.ru/images/two-one.png" alt=""></a>
<div class="over_block">
                                        <a href="#"><p class="title">title here</p></a>
                                        <p class="sub-title">At vero eos et accusamus et<br> iusto odio dignissimos ducimus <br>qui blanditiis praesentium</p>
                                        <div class="icons">
                                            <a href="#"><img src="http://www.cyberforum.ru/images/link-ic.png" alt=""></a>
                                            <a href="#"><img src="http://www.cyberforum.ru/images/like-inc.png" alt=""></a></div>
                                        </div>
                                        </li>
                                        <li><a href="#"><img src="http://www.cyberforum.ru/images/free-one.png" alt=""></a>
<div class="over_block">
                                        <a href="#"><p class="title">title here</p></a>
                                        <p class="sub-title">At vero eos et accusamus et<br> iusto odio dignissimos ducimus <br>qui blanditiis praesentium</p>
                                        <div class="icons">
                                            <a href="#"><img src="http://www.cyberforum.ru/images/link-ic.png" alt=""></a>
                                            <a href="#"><img src="http://www.cyberforum.ru/images/like-inc.png" alt=""></a></div>
                                        </div>
                                        </li>
                                        </ul>
                                        <ul class="content">
                                        <li><a href="#"><img src="http://www.cyberforum.ru/images/one-two.png" alt=""></a>
<div class="over_block">
                                        <a href="#"><p class="title">title here</p></a>
                                        <p class="sub-title">At vero eos et accusamus et<br> iusto odio dignissimos ducimus <br>qui blanditiis praesentium</p>
                                        <div class="icons">
                                            <a href="#"><img src="http://www.cyberforum.ru/images/link-ic.png" alt=""></a>
                                            <a href="#"><img src="http://www.cyberforum.ru/images/like-inc.png" alt=""></a></div>
                                        </div>
                                        </li>                       
                                        <li><a href="#"><img src="http://www.cyberforum.ru/images/two-two.png" alt=""></a>
<div class="over_block">
                                        <a href="#"><p class="title">title here</p></a>
                                        <p class="sub-title">At vero eos et accusamus et<br> iusto odio dignissimos ducimus <br>qui blanditiis praesentium</p>
                                        <div class="icons">
                                            <a href="#"><img src="http://www.cyberforum.ru/images/link-ic.png" alt=""></a>
                                            <a href="#"><img src="http://www.cyberforum.ru/images/like-inc.png" alt=""></a></div>
                                        </div>
                                        </li>
                                        <li><a href="#"><img src="http://www.cyberforum.ru/images/free-two.png" alt=""></a>
<div class="over_block">
                                        <a href="#"><p class="title">title here</p></a>
                                        <p class="sub-title">At vero eos et accusamus et<br> iusto odio dignissimos ducimus <br>qui blanditiis praesentium</p>
                                        <div class="icons">
                                            <a href="#"><img src="http://www.cyberforum.ru/images/link-ic.png" alt=""></a>
                                            <a href="#"><img src="http://www.cyberforum.ru/images/like-inc.png" alt=""></a></div>
                                        </div>
                                        </li>
                                        </ul>
                                        <ul class="content">
                                        <li><a href="#"><img src="http://www.cyberforum.ru/images/one-free.png" alt=""></a>
<div class="over_block">
                                        <a href="#"><p class="title">title here</p></a>
                                        <p class="sub-title">At vero eos et accusamus et<br> iusto odio dignissimos ducimus <br>qui blanditiis praesentium</p>
                                        <div class="icons">
                                            <a href="#"><img src="http://www.cyberforum.ru/images/link-ic.png" alt=""></a>
                                            <a href="#"><img src="http://www.cyberforum.ru/images/like-inc.png" alt=""></a></div>
                                        </div>
                                        </li>
                                        <li><a href="#"><img src="http://www.cyberforum.ru/images/two-free.png" alt=""></a>
<div class="over_block">
                                        <a href="#"><p class="title">title here</p></a>
                                        <p class="sub-title">At vero eos et accusamus et<br> iusto odio dignissimos ducimus <br>qui blanditiis praesentium</p>
                                        <div class="icons">
                                            <a href="#"><img src="http://www.cyberforum.ru/images/link-ic.png" alt=""></a>
                                            <a href="#"><img src="http://www.cyberforum.ru/images/like-inc.png" alt=""></a></div>
                                        </div>
                                        </li>
                                        <li><a href="#"><img src="http://www.cyberforum.ru/images/free-free.png" alt=""></a>
<div class="over_block">
                                        <a href="#"><p class="title">title here</p></a>
                                        <p class="sub-title">At vero eos et accusamus et<br> iusto odio dignissimos ducimus <br>qui blanditiis praesentium</p>
                                        <div class="icons">
                                            <a href="#"><img src="http://www.cyberforum.ru/images/link-ic.png" alt=""></a>
                                            <a href="#"><img src="http://www.cyberforum.ru/images/like-inc.png" alt=""></a></div>
                                        </div>
                                        </li>
                                        </ul>
                                        <ul class="content">
                                        <li><a href="#"><img src="http://www.cyberforum.ru/images/one-four.png" alt=""></a>
<div class="over_block">
                                        <a href="#"><p class="title">title here</p></a>
                                        <p class="sub-title">At vero eos et accusamus et<br> iusto odio dignissimos ducimus <br>qui blanditiis praesentium</p>
                                        <div class="icons">
                                            <a href="#"><img src="http://www.cyberforum.ru/images/link-ic.png" alt=""></a>
                                            <a href="#"><img src="http://www.cyberforum.ru/images/like-inc.png" alt=""></a></div>
                                        </div>
                                        </li>
                                        <li><a href="#"><img src="http://www.cyberforum.ru/images/two-four.png" alt=""></a>
<div class="over_block">
                                        <a href="#"><p class="title">title here</p></a>
                                        <p class="sub-title">At vero eos et accusamus et<br> iusto odio dignissimos ducimus <br>qui blanditiis praesentium</p>
                                        <div class="icons">
                                            <a href="#"><img src="http://www.cyberforum.ru/images/link-ic.png" alt=""></a>
                                            <a href="#"><img src="http://www.cyberforum.ru/images/like-inc.png" alt=""></a></div>
                                        </div>
                                        </li>
                                        <li><a href="#"><img src="http://www.cyberforum.ru/images/free-four.png" alt=""></a>
<div class="over_block">
                                        <a href="#"><p class="title">title here</p></a>
                                        <p class="sub-title">At vero eos et accusamus et<br> iusto odio dignissimos ducimus <br>qui blanditiis praesentium</p>
                                        <div class="icons">
                                            <a href="#"><img src="http://www.cyberforum.ru/images/link-ic.png" alt=""></a>
                                            <a href="#"><img src="http://www.cyberforum.ru/images/like-inc.png" alt=""></a></div>
                                        </div>
                                        </li>   
                                        </ul>                               
                                    </ul>
                                </div>
CSS
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
.portfolio .content{
    margin-top: 70px;
    float: left;
}
.portfolio .content li{border: 1px solid red;
    margin: 6px 6px;
display: block;
position: relative;
overflow: hidden;
}
.portfolio .content .over_block{
    background-color: #131313;
    opacity: 0.8;
    width:100%;
    height:100%;
    position:absolute;
    top:0;
    left:0;
    -moz-transition:all 1s;
    -webkit-transition:all 1s;
    -o-transition:all 1s;
    transition:all 1s;   
    padding: 35% 15%;
    text-align: left;
    opacity: 0.8;
}
.portfolio .content .over_block p.title{
padding-top: 0;
margin-bottom: 0;
padding-bottom: 25%;
font: 20px Source Sans Pro Light, sans-serif;
color: #19bd9a;
line-height:2;
}
.portfolio .content .over_block p.title:after{
    display: block;
    content: "";
    height: 2px;
    width: 0%;
    background-color: #19bd9a;
}
.portfolio .content .over_block p.title:hover:after,
.portfolio .content .over_block p.title:focus:after {
    width: 24px;}
.portfolio .content .over_block p.sub-title{
font: 12px/18px open_sansregular, sans-serif;
    color: #b2b3b3;
}
.portfolio .content .over_block .icons{
}
.portfolio .content .over_block .icons a{
    margin-right: 5px;
    display: inline-block;
    width: 30px; height: 30px;
    background-color: #000000;
    border-radius: 50%;
    padding: 8px 8px;
}
.portfolio .content .over_block .icons a:hover{
    background-color: #19bd9a;
}
.portfolio .content .over_block:hover{
    opacity: 0.8;
}
Ответ: Молчание ягнят

Добавлено через 4 часа 32 минуты


Добавлено через 15 часов 4 минуты
спасибо сделал
Вопрос: Редактирование виджета Woocommerce Dropdown Cart Widget

Это плагин раскрывающейся корзины. Мне необходимо убрать функцию ее раскрытия. То есть мне необходимо, чтобы при добавлении товара в корзину рядом с ней по прежнему отображалась сумма и колличество товаров, а по нажатию на нее переходило в саму корзину. То есть я хочу убрать это выпадающее меню с перечнем и изображением товаров..
Для наглядности на первом скрине как есть при нажатии на нее, а на втором как надо чтобы было.. (при нажатии просто переход в корзину - в идеале чтобы выпадало меню "перейти в корзину" и "Оформление заказа"


Я так понимаю что-то нужно менять здесь
PHPHTML
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
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
<?php
/*
Plugin Name: Woocommerce Dropdown Cart
Plugin URI: [url]https://wordpress.org/plugins/woocommerce-dropdown-cart/[/url]
Description: A widget plugin for WooCommerce to display the cart at top of page
Author: Phuc Pham
Version: 2.1
Author URI: [url]https://www.facebook.com/svincoll4[/url]
*/
 
class WooCommerce_Widget_DropdownCart extends WP_Widget {
 
    var $default_values = array(
        'title' => '',
        'hide_if_empty' => 0,
        'show_on_checkout' => 0,
        'popup_align' => 'left'
    );
 
    function __construct() {
 
        /* Widget settings. */
        $widget_options = array(
            'classname' => 'widget_shopping_mini_cart dropdown-cart',
            'description' => __( "Display the cart content", 'woocommerce-ddc' )
        );
 
        /* Create the widget. */
        parent::__construct( 'widget_shopping_mini_cart', __( 'WooCommerce Dropdown Cart', 'woocommerce-ddc' ), $widget_options );
    }
 
 
    function widget( $args, $instance ) {
 
        $instance = wp_parse_args($instance, $this->default_values);
 
        if(empty($instance['show_on_checkout']) && (is_cart() || is_checkout())){
            return;
        }
 
        $woocommerce = WC();
 
        $before_widget = $after_widget = $before_title = $after_title = '';
        extract( $args, EXTR_OVERWRITE );
 
 
        $hide_if_empty = empty( $instance['hide_if_empty'] )  ? 0 : 1;
        $popup_align = $instance['popup_align'] == 'left'?'left':'right';
 
        echo $before_widget;
 
        $title = apply_filters('widget_title', $instance['title']);
        if ( $title )
            echo $before_title . $title . $after_title;
 
        $cart_contents_count = $woocommerce->cart->get_cart_contents_count();
 
        $item_text = __('item', 'woocommerce-ddc');
        $items_text = __('items', 'woocommerce-ddc');
 
        ?>
        <div class="widget_shopping_mini_cart_content" id="<?php echo $this->id ?>-content">
            <?php if ( !$hide_if_empty || $cart_contents_count > 0 ) : ?>
                <div class="dropdown-cart-button <?php echo $hide_if_empty ? 'hide_dropdown_cart_widget_if_empty' : '' ?>" style="<?php echo $hide_if_empty && sizeof( $woocommerce->cart->get_cart() ) == 0 ? "display:none;":"" ?>">
                    <a href="#" class="dropdown-total"><?php echo $cart_contents_count.' '._n($item_text, $items_text, $cart_contents_count) ?> - <?php echo $woocommerce->cart->get_cart_subtotal(); ?></a>
                    <div class="dropdown dropdown-<?php echo $popup_align ?>">
                        <?php woocommerce_mini_cart(); ?>
                        <div class="clear"></div>
                    </div>
                </div>
            <?php else: ?>
                <script type="text/javascript">
                    jQuery(function($){
                        $('#<?php echo $this->id ?>').hide();
                    });
                </script>
            <?php endif; ?>
        </div>
        <?php
        echo $after_widget;
 
    }
 
 
    /**
     * update function.
     *
     * @see WP_Widget->update
     * @access public
     * @param array $new_instance
     * @param array $old_instance
     * @return array
     */
    function update( $new_instance, $old_instance ) {
        $instance['title'] = strip_tags( stripslashes( $new_instance['title'] ) );
        $instance['hide_if_empty'] = empty( $new_instance['hide_if_empty'] ) ? 0 : 1;
        $instance['show_on_checkout'] = empty( $new_instance['show_on_checkout'] ) ? 0 : 1;
        $instance['popup_align'] = $new_instance['popup_align'];
        return $instance;
    }
 
 
    /**
     * form function.
     *
     * @see WP_Widget->form
     * @access public
     * @param array $instance
     * @return void
     */
    function form( $instance ) {
 
        $instance = wp_parse_args($instance, $this->default_values);
 
        $hide_if_empty = empty( $instance['hide_if_empty'] ) ? 0 : 1;
        $show_on_checkout = empty( $instance['show_on_checkout'] ) ? 0 : 1;
        ?>
        <p><label for="<?php echo $this->get_field_id('title'); ?>"><?php _e('Title:', 'woocommerce-ddc') ?></label>
            <input type="text" class="widefat" id="<?php echo esc_attr( $this->get_field_id('title') ); ?>" name="<?php echo esc_attr( $this->get_field_name('title') ); ?>" value="<?php if (isset ( $instance['title'])) {echo esc_attr( $instance['title'] );} ?>" /></p>
 
        <p><input type="checkbox" class="checkbox" id="<?php echo esc_attr( $this->get_field_id('hide_if_empty') ); ?>" name="<?php echo esc_attr( $this->get_field_name('hide_if_empty') ); ?>"<?php checked( $hide_if_empty ); ?> />
            <label for="<?php echo $this->get_field_id('hide_if_empty'); ?>"><?php _e( 'Hide if cart is empty', 'woocommerce-ddc' ); ?></label></p>
 
        <p><input type="checkbox" class="checkbox" id="<?php echo esc_attr( $this->get_field_id('show_on_checkout') ); ?>" name="<?php echo esc_attr( $this->get_field_name('show_on_checkout') ); ?>"<?php checked( $show_on_checkout ); ?> />
            <label for="<?php echo $this->get_field_id('show_on_checkout'); ?>"><?php _e( 'Show this widget on cart/checkout pages', 'woocommerce-ddc' ); ?></label></p>
        <p>
            <label for="<?php echo $this->get_field_id('popup_align') ?>"><?php _e('Popup align:', 'woocommerce-ddc') ?></label>
            <select name="<?php echo $this->get_field_name('popup_align') ?>" id="<?php echo $this->get_field_id('popup_align') ?>" class="widefat">
                <option value="left" <?php selected('left', $instance['popup_align']) ?>><?php _e('Left', 'woocommerce-ddc') ?></option>
                <option value="right" <?php selected('right', $instance['popup_align']) ?>><?php _e('Right', 'woocommerce-ddc') ?></option>
            </select>
        </p>
    <?php
    }
 
 
 
}
 
function register_WooCommerce_Widget_DropdownCart() {
    if(class_exists('Woocommerce')) {
        register_widget('WooCommerce_Widget_DropdownCart');
    }
}
 
add_action( 'widgets_init', 'register_WooCommerce_Widget_DropdownCart' );
 
function register_script_WooCommerce_Widget_DropdownCart() {
    if(class_exists('Woocommerce')) {
        if( !is_admin() ){
            wp_enqueue_script('jquery');
 
            $suffix = !WP_DEBUG ? '.min' : '';
 
            wp_enqueue_script('jquery-dropdown-cart', plugins_url('woocommerce-dropdown-cart/js/main'.$suffix.'.js'), array('jquery'));
            wp_enqueue_style('jquery-dropdown-cart', plugins_url('woocommerce-dropdown-cart/css/style'.$suffix.'.css'));
 
 
 
        }
    }
}
add_action( 'wp_enqueue_scripts', 'register_script_WooCommerce_Widget_DropdownCart' );
 
add_action( 'plugins_loaded', 'woocommerce_ddc_load_textdomain' );
function woocommerce_ddc_load_textdomain(){
    $domain = "woocommerce-ddc";
 
    $locale = apply_filters('plugin_locale', get_locale(), $domain);
    load_textdomain($domain, WP_LANG_DIR.'/'.$domain.'-'.$locale.'.mo');
    load_plugin_textdomain( $domain, false, plugin_basename( dirname( __FILE__ ) ) . '/languages' );
}
Это содежимое основного woocommerce-dropdown-cart.php

А это main.JS
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
jQuery(function($){
    $('body').on('click', '.dropdown-cart-button .dropdown-total', function($e){
        var $button = $(this).parent();
        var $popup = $('.dropdown', $button);
 
        if(!$popup.is(':visible')){
 
            $popup.removeClass('drop-left')
                .removeClass('drop-bottom');
 
            // get width/height
            $popup.show();
            var $width = $popup.width();
            var $height = $popup.height();
            var $button_offset = $button.get(0).getBoundingClientRect();
            $popup.hide();
 
            var $left = $button_offset.right - $width;
            var $right = $(window).width() - ($button_offset.left + $width);
            var $top = $button_offset.bottom - $height;
            var $bottom = $(window).height() - ($button_offset.bottom + $height);
 
            if($left < 10 && $right > 0){
                $popup.addClass('drop-left');
            }
 
            if($bottom < 10 && $top > 0){
                $popup.addClass('drop-bottom');
            }
 
            $popup.slideDown();
        }else{
            $popup.slideUp();
        }
 
 
        return false;
    });
 
    $('body').on('click', '.dropdown-cart-button', function($e){
        $e.stopPropagation();
    });
 
    $(document).on('click', function(){
        $('.dropdown-cart-button .dropdown').hide();
    });
 
    $('body').bind('adding_to_cart', function(){
        $('.widget_shopping_mini_cart').show();
    });
 
    $('body').bind('added_to_cart', function(){
        $('.widget_shopping_mini_cart').addClass('loading');
        var this_page = window.location.toString();
        this_page = this_page.replace( 'add-to-cart', 'added-to-cart' );
        if(this_page.indexOf('?') >= 0){
            this_page += '&t=' + new Date().getTime();
        }else{
            this_page += '?t=' + new Date().getTime();
        }
 
        $('.widget_shopping_mini_cart').each(function($i, $item){
            $($item).load( this_page + ' #' + $item.id + '-content', function(){
                $($item).removeClass('loading');
            });
        });
 
    });
 
 
});
main.min.js
Javascript
1
2
jQuery(function(a){a("body").on("click",".dropdown-cart-button .dropdown-total",function(d){var c=a(this).parent();var b=a(".dropdown",c);if(!b.is(":visible")){b.removeClass("drop-left").removeClass("drop-bottom");b.show();var e=b.width();var h=b.height();var i=c.get(0).getBoundingClientRect();b.hide();var f=i.right-e;var k=a(window).width()-(i.left+e);var g=i.bottom-h;var j=a(window).height()-(i.bottom+h);if(f<10&&k>0){b.addClass("drop-left")}if(j<10&&g>0){b.addClass("drop-bottom")}b.slideDown()}else{b.slideUp()}return false});a("body").on("click",".dropdown-cart-button",function(b){b.stopPropagation()});a(document).on("click",function(){a(".dropdown-cart-button .dropdown").hide()});a("body").bind("adding_to_cart",function(){a(".widget_shopping_mini_cart").show()});a("body").bind("added_to_cart",function(){a(".widget_shopping_mini_cart").addClass("loading");var b=window.location.toString();b=b.replace("add-to-cart","added-to-cart");if(b.indexOf("?")>=0){b+="&t="+new Date().getTime()}else{b+="?t="+new Date().
getTime()}a(".widget_shopping_mini_cart").each(function(d,c){a(c).load(b+" #"+c.id+"-content",function(){a(c).removeClass("loading")})})})});
Заранее благодарен за любую помощ в решении моей проблемы!
Ответ: Нашел вот такую тему - но в моем случае не работает..

PHP
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
<?php
//* Активируем поддержку шрифта Font Awesome
add_action( 'wp_enqueue_scripts', 'enqueue_font_awesome' );
function enqueue_font_awesome() {
    wp_enqueue_style( 'font-awesome', '//netdna.bootstrapcdn.com/font-awesome/4.0.3/css/font-awesome.css' );
}
/**
 * Помещаем иконку корзины с количеством товаров и общей стоимостью в меню навигации.
 *
 * Источник: http://wordpress.org/plugins/woocommerce-menu-bar-cart/
 */
add_filter('wp_nav_menu_items','sk_wcmenucart', 10, 2);
function sk_wcmenucart($menu, $args) {
    // Проверяем, установлен ли и активирован плагин WooCommerce и добавляем новый элемент в меню, назначенному основным меню навигации
    if ( !in_array( 'woocommerce/woocommerce.php', apply_filters( 'active_plugins', get_option( 'active_plugins' ) ) ) || 'primary' !== $args->theme_location )
        return $menu;
    ob_start();
        global $woocommerce;
        $viewing_cart = __('View your shopping cart', 'your-theme-slug');
        $start_shopping = __('Start shopping', 'your-theme-slug');
        $cart_url = $woocommerce->cart->get_cart_url();
        $shop_page_url = get_permalink( woocommerce_get_page_id( 'shop' ) );
        $cart_contents_count = $woocommerce->cart->cart_contents_count;
        $cart_contents = sprintf(_n('%d item', '%d items', $cart_contents_count, 'your-theme-slug'), $cart_contents_count);
        $cart_total = $woocommerce->cart->get_cart_total();
        // Раскомментируйте строку ниже для того, чтобы скрыть иконку корзины в меню, когда нет добавленных товаров в корзине.
        // if ( $cart_contents_count > 0 ) {
            if ($cart_contents_count == 0) {
 
                $menu_item = '<li class="right"><a class="wcmenucart-contents" href="'. $shop_page_url .'" title="'. $start_shopping .'">';
            } else {
                $menu_item = '<li class="right"><a class="wcmenucart-contents" href="'. $cart_url .'" title="'. $viewing_cart .'">';
            }
            $menu_item .= '<i class="fa fa-shopping-cart"></i> ';
            $menu_item .= $cart_contents.' - '. $cart_total;
            $menu_item .= '</a></li>';
        // Раскомментируйте строку ниже для того, чтобы скрыть иконку корзины в меню, когда нет добавленных товаров в корзине.
 
        // }
        echo $menu_item;
    $social = ob_get_clean();
    return $menu . $social;
}
Вопрос: IE11 Windows Phone пролистывание длинного всплывающего блока (hover) на малом устройстве

Уважаемые форумчане, просьба проверить на Windows Phone 8 IE11 (Nokia Lumia) кнопку Расписание. () А именно, возможность посмотреть всплывающую таблицу до конца, полностью.

Как исправить проблему, что на некоторых WP8 IE11 при попытке просмотреть всплывающую таблицу до конца или просто случайно коснувшись экрана, таблица моментально исчезает?

На всех других устройствах, во всех браузерах (даже IE11 на desktop в режиме эмуляции) все работает корректно.
Ниже привожу код:
Код CSS
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
*{
margin:0;
padding:0;
}
body{
    font-family: Arial, san-serif;
    font-size: 14px;
}
.timetable {border-top: 1px solid black !important; border-left: 1px solid black; border-right: 1px solid black; width: 98%; display:block;}
.verch {display:block; border-top: 1px solid black !important;}
.ver1 {display:block; float:left; width:15%;text-align:left;font-weight:bold;}
.verch1 {display:block;font-weight:bold;}
.ver2 {display:block; float:left; width:30%;text-align:center;border-left: 1px solid black;min-height:40px;}
 .ver3 {display:block; float:left; width:20%;text-align:center;border-left: 1px solid black;min-height:40px;}
.ver5 {display:block; float:left; width:15%; text-align:left;border-left: 1px solid black;min-height:40px;}
.ver4 {display:block; float:left; width:25%;text-align:center;border-left: 1px solid black;min-height:40px;}
.ver6 {display:block; float:left; width:15%; text-align:center;border-left: 1px solid black;min-height:40px;}
.verch1 .ver1, .verch1 .ver2, .verch1 .ver3, .verch1 .ver4 {text-align:center; min-height:40px;}
.verch11 {border:1px solid black; min-height:40px;}
.modal span.tbl {display:none;}
@media screen and (max-width: 550px) {
.fon{background:none;}
.formpart {color:black; text-align:left;}
.navig {margin-top: 30%;}
.modal {position: relative; min-height: 40px; width: 100%; text-align: center; padding: 45px 0px 0px;background: url("../img/line.png") no-repeat center center transparent;background-size: 100%; color: white; font-size: 1.4em; font-weight: bold;}
.modal span.tbl {display:block;}    
.modal-container {width: 100%; padding: 25px 0px; position: relative;top: -15px; left: 0px;}
    .modal ul li {
        display: none; /* скрыть все <li> пункты */
        margin: 0;
    }
    .modal .current {
        display: block; /* показывать только текущие активные <li> пункты */
    }
    .modal a {
        display: block;
        padding: 5px 5px 5px 32px;
        text-align: left;
    }
    .modal .current a {
        background: none;
        color: #666;
    }
 
    /* при наведении на кнопку */
.modal .modal-container:hover, .modal .modal-container:active {
        background: white;height:auto;min-height:100%;cursor: pointer;  -ms-touch-action: pan-y;}
.modal .modal-container:focus {
        background: white;  -ms-touch-action: pan-y;}
.modal .modal-container:hover ul li{
        display: block; cursor: pointer;
        margin: