0

Подскажите, как сделать чтобы шрифт и интервал не менялся в определенном месте (у меня реализовано как панель-меню). И при нажатии на эти кнопки меняется все на сайте, кроме кнопок с названием (шрифт, а- и а+). В данный момент маштабируется и изменяется шрифт везде. При добавлении width: 270px !important; height: 30px !important; рамка кнопки стоит на месте как и нужно, но шрифт в ней меняет размеры

button = document.createElement('input');
    parentElem = document.body;
    button.type = 'button';
    button.id = 'minus';
    button.value = ' А- ';
    button.setAttribute("onclick","fontSize(this)");
    button.setAttribute("style","position:fixed; z-index:9999; top:35px;left:35%; font-size: 20px; font-weight: bold;");
    parentElem.insertBefore(button, parentElem.lastChild);

    button = document.createElement('div');
    parentElem = document.body;
    button.innerHTML = 'Шрифт';
    button.setAttribute("style","position:fixed; z-index:9999; top:10px;left:37%; font-size: 16px; font-weight: bold;");
    parentElem.insertBefore(button, parentElem.lastChild);


    button = document.createElement('input');
    parentElem = document.body;
    button.type = 'button';
    button.id = 'plus';
    button.value = ' А+ ';
    button.setAttribute("onclick","fontSize(this)");
    button.setAttribute("style","position:fixed; z-index:9999; top:35px;left:39%; font-size: 20px; font-weight: bold;");
    parentElem.insertBefore(button, parentElem.lastChild);
    
    
    
    function intervalSize(obj){
    
    var allelem = document.getElementsByTagName("*");
    
    if(obj.id=="intervalPlus")
        if(interval>60)interval=60; else interval+=10;
    else 
        if(interval<=15) interval=15; else interval-=10;
    for(var i=0; i<allelem.length; i++) allelem[i].style.lineHeight=interval+"px";
    
}


function fontSize(obj){
    
    var a = document.getElementsByTagName("*");
    
    if(obj.id=="plus")
        if(fontS>40) fontS = 40; else fontS+=10;
    else 
        if(fontS<=15) fontS=15; else fontS-=10;
    for(var i=0; i<a.length; i++) a[i].style.fontSize=fontS+"px";
    
}

1
  • Вам надо поменять шрифт везде кроме кнопок? Я правильно понял вашу трудность?
    – Lukas
    11 дек 2018 в 7:42

1 ответ 1

1

Добавьте класс к вашим кнопкам и исключите их из выборки var a = document.querySelectorAll("*:not(.no-scale)");

button = document.createElement('input');
parentElem = document.body;
button.type = 'button';
button.id = 'minus';
button.className = 'no-scale';
button.value = ' А- ';
button.setAttribute("onclick", "fontSize(this)");
button.setAttribute("style", "position:fixed; z-index:9999; top:35px;left:35%; font-size: 20px; font-weight: bold;");
parentElem.insertBefore(button, parentElem.lastChild);

button = document.createElement('div');
parentElem = document.body;
button.innerHTML = 'Шрифт';
button.className = 'no-scale';
button.setAttribute("style", "position:fixed; z-index:9999; top:10px;left:37%; font-size: 16px; font-weight: bold;");
parentElem.insertBefore(button, parentElem.lastChild);


button = document.createElement('input');
parentElem = document.body;
button.type = 'button';
button.id = 'plus';
button.className = 'no-scale';
button.value = ' А+ ';
button.setAttribute("onclick", "fontSize(this)");
button.setAttribute("style", "position:fixed; z-index:9999; top:35px;left:59%; font-size: 20px; font-weight: bold;");
parentElem.insertBefore(button, parentElem.lastChild);

var fontS = 16,
  interval = 14;


function intervalSize(obj) {

  var allelem = document.querySelectorAll("*:not(.no-scale)");

  if (obj.id == "intervalPlus") {
    if (interval > 60) interval = 60;
    else interval += 10;
  } else {
    if (interval <= 15) interval = 15;
    else interval -= 10;
  }
  for (var i = 0; i < allelem.length; i++) allelem[i].style.lineHeight = interval + "px";

}


function fontSize(obj) {

  var a = document.querySelectorAll("*:not(.no-scale)");

  if (obj.id == "plus") {
    if (fontS > 40) fontS = 40;
    else fontS += 10;
  } else {
    if (fontS <= 15) fontS = 15;
    else fontS -= 10;
  }
  for (var i = 0; i < a.length; i++) a[i].style.fontSize = fontS + "px";

}
<div>Text</div>
<div>Text</div>
<div>Text</div>
<div>Text</div>
<div>Text</div>

4
  • А слово "шрифт" меняет размеры, а оно тоже не должно меняться
    – Ирина
    11 дек 2018 в 7:57
  • Добавьте класс к этому тегу тоже..... (в примере добавил)
    – Ofer
    11 дек 2018 в 7:58
  • Отлично, спасибо большое.
    – Ирина
    11 дек 2018 в 8:01
  • кто подскажет, как можно запретить работу скрипта в хедере и в меню, чтобы оно оставалось прежним? и не меняла свои размеры.
    – Ирина
    28 дек 2018 в 7:50

Ваш ответ

By clicking “Отправить ответ”, you agree to our terms of service and acknowledge you have read our privacy policy.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.