Создание сайта Винница, Заказать сайт Винница, купить сайт Винница, Разработка сайта Винница, продвижение сайта Винница, сопроводжение сайта Винница

В этом уроке рассмотрим возможность управления выделением данных на html-странице. Создание сайтов Винница - будет полезно как для начинающих девелоперов, так и для профи.

Занявшись поиском в сети интернет я набрел на множество способов управления выделением текста с помощью css. К примеру, чтобы отключить на сайте выделение в определенном классе - пишем:

.unselectable {
   -moz-user-select: -moz-none;
   -khtml-user-select: none;
   -webkit-user-select: none;
   -o-user-select: none;
   user-select: none;
}

или если нужно разрешить выделять только текст - заменяем none на text.

но этот способ весьма ограничен и не гибок + работает не во всех браузерах. Проверьте сами :)

Второй способ, что мне удалось найти и применить - это управление выделением текста посредством javascript. Код ниже демонстрирует реализацию этого способа:

function returnFalse(e){
      return false;
    }

    function cancelEvent(e){
      if(e.preventDefault)e.preventDefault();
      else e.returnValue=false;
    }

    function addHandler(e,event,action,param){
      if(document.addEventListener)e.addEventListener(event,action,param);
      else if(document.attachEvent)e.attachEvent('on'+event,action);
      else e['on'+event]=action;
    }

    function removeHandler(e,event,action,param){
      if(document.addEventListener)e.removeEventListener(event,action,param);
      else if(document.attachEvent)e.detachEvent('on'+event,action);
      else e['on'+event]=returnFalse;
    }

    addHandler(document,'mousedown',mouseDown,false);
    addHandler(document,'mouseup',mouseUp,false);

    function mouseDown(e){
      if((e.target.nodeName!="INPUT")&&
         (e.target.nodeName!="TEXTAREA")&&
         (e.target.nodeName!="H1")&&
         (e.target.nodeName!="H2")&&
         (e.target.nodeName!="H3")&&
         (e.target.nodeName!="P")&&
         (e.target.id.substr(0,3)!="lbl")&&
         (e.target.id.substr(0,3)!="ttl")
        )
      {
          e=e||event;
          cancelEvent(e);
          addHandler(document,'selectstart',returnFalse,false);
      }
    }

    function mouseUp(e){
      removeHandler(document,'selectstart',returnFalse,false);
    }

Основное внимание заслуживает функция function mouseDown(e). В ней как раз и можн озадать теги, имена классов, имена ид тегов, и другую логику, по которой на вашем сайте не будет выдляться в том или ином месте объект, картинка, или текст.

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

Спасибо за внимание.

И помните, создание сайтов в Виннице - это искусство, не сравнимое с созданием такого же сайта в Киеве :)