Сделал функцию автообновления под Opera Mobile. Есть вопрос
 

Всем привет. Вообщем, с трудом, но доделал эту функцию, которой нет в Opera Mobile(см. скриншоты и код ниже). Буду рад любой критике.:) Вот один вопрос:

На одном сайте не работают <big> и жирность. На втором сайте, не работает функция увеличенного масштаба встроенная в браузер, из-за этого кнопка по размерам меньше. На третьем сайте зайдя в один раздел
кнопки нет. Я так понял это из-за настройки стиля css на сайтах, ведь кнопка внедряется туда вроде или нет?
В браузере есть свой style.css, так вот как его подключить, чтобы на кнопку не влияли стили сайтов и масштаб? Если возможно такое.

Только начал изучать JS, строго не судите. Как его внедрить в браузер, смотрите в гугле.

Вот собственно сам скрипт:

if(!self.parent.frames.length) {
  
  var d = document;
  var e = d.createElement('button');
  var setCss = 'font-size: 27px; position: fixed; left: 0px; height: 48px; width: 57px; background: #e3e8e1; color: #3F3F3F; font-weight: 900; border-radius: 0 6px 6px 0; border: 1px solid gray; z-index: 9999; opacity: 0.9; filter:alpha(opacity=90); ';
  var stopX = '✖';
  var startO = '↻';
  var sec;
  var refreshId;
  var delinfo;

  function reloads() { 
  location.reload();
  }

  function timerInfo() {
  var e = d.createElement('button');
  e.style.cssText = setCss+'top: 150px;';
  d.documentElement.appendChild(e);
  delinfo = e;
  e.innerHTML = '<span id="timer"></span>';
  e.onclick = function() {
  callback();
  //пауза
     }
   }

  function timerSec() {

  if(sec<=9) {
  sec='0' + sec; }

  if(document.getElementById) {
  timer.innerHTML=sec; }

  if(sec==00) {
  reloads();
  return false; }

  sec--;

  refreshId = setTimeout(timerSec, 1000);
 }

  function askSeconds() {
  var ask = prompt('Интервал в секундах (2-960):', 5);

  if(!ask || isNaN(ask)) {
  callback();
  } 
else if(ask < 2) {
  alert('Минимум 2 секунды!');
  callback();
  }
else if(ask > 960) {
  alert('Максимум 960 секунд!');
  callback();
  } else {
  sessionStorage.setItem('key', ask);
  sec = ask;
  timerInfo();
  timerSec(sec);
    }
  }

  function startrefresh() {
  e.style.cssText = setCss+'top: 100px;';
  d.documentElement.appendChild(e);
  e.innerHTML = startO;
  e.onclick = function() {
  askSeconds();
 stopautorefresh();
    }
  }

  function stopautorefresh() {
  e.style.cssText = setCss+'top: 100px;';
  d.documentElement.appendChild(e);
  e.innerHTML = stopX;
 e.onclick = function() {

  sessionStorage.clear();
  clearTimeout(refreshId);
  delinfo.outerHTML = '';
  return startrefresh();
    }
  }

  if(sessionStorage.getItem('key')) {
  sec = sessionStorage.getItem('key');
  stopautorefresh();
  timerInfo();
  timerSec(sec);
  } else {
  startrefresh();
   }
}

Кнопка всегда слева в фиксированном месте экрана и доступна в любой части страницы.
Может кому пригодится.
Спасибо всем!

Скрипт заточен под настройки масштаба 100% в браузере.
Чтобы этот скрипт работал в браузере Opera Mobile, нужно:
1) Прописать в адресной строке opera:config
2) Перейти во вкладку UserPrefs
3) Поставить галочки под строками User JavaScript и User JavaScript on HTTPS
4) В поле User JavaScript File прописать путь к файлу где хранится, например C:/papka/file.js, так же можно через запятую и пробел писать другие пути к файлам, у меня их 5.
5) Снять галочку с Disable Client Refresh To Same, иначе страница обновится только раз после запуска.
6) Поставить галочку Always Load User JavaScript, для загрузки скрипта на всех страницах.

может лучше сделать на основе MutationObserver?
https://developer.mozilla.org/ru/doc...tationObserver

поддерживается Opera mobile с 15 версии

у меня ОС Symbian ^3, и опера последней версии 12. Врятли это MutationObserver будет доступно.

решил проблему с таймером, теперь не отстаёт. И временное решение проблемы 1). Тему отредактировал всесте с кодом.

С отступами беда.

Стили можно добавить тем же скриптом
просто дописать в конец тега.

document.querySelector('style').innerHTML += '#col{background-color: red;}';

чтобы к вашем элементам не применялись стили сайтов используйте кастомные теги для ваших элементов.

Для чего вам нужна эта программа?

поправил.:thanks:

Спасибо, по эксперемнтирую, только тут беда в том, что кнопка встраивается в саму страницу сайтов, т.е. Если вылезет ошибка 502, 403, 404 (белая страница), то кнопки нет. На этом сайте position: fixed то работает, то нет. Кнопка зависает в одном месте и не прыгает вместе с прокруткой. Меняв координаты на низ top : 547px;, она привязывается к масштабу страницы вниз на 547pх и отступ слева 60pх, а не экрана смартфона. Я так понял кнопка в HTML и css страницы сайтов внедряется, вот и спрашиваю как привязать стиль из браузера по пути file:// или свой создать с html. Чтобы она всегда в одном месте была.:thanks:

я же не спрашиваю разработчикоков зачем придумали и сделали функцию автообновления в некоторых браузерах? Нужная и полезная всем вещь. :yes: