Установите цвет выделения текста с помощью jQuery. Демо не работает - PullRequest
Новая
       84

Установите цвет выделения текста с помощью jQuery. Демо не работает

4 голосов
/ 12 декабря 2011

http://jsfiddle.net/uKdPM/

Я установил цвет ::selection в css, поэтому, когда вы выделяете текст на экране, цвет текста становится розовым. Я пытаюсь переопределить этот цвет через JQuery, когда страница загружается. Похоже, это должно быть супер просто. Но это не работает для меня.

Ответы [ 5 ]

5 голосов
/ 12 декабря 2011

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

Хотя я думаю, что ваш вопрос интересен, мне трудно разобраться, где это можно использовать на практике. Хотите сменить тему на лету?

2 голосов
/ 12 декабря 2011

Согласно этому вопросу вы не можете изменить цвет подсветки выделения, потому что нет интерфейса DOM для манипулирования псевдоклассами. Что вы можете сделать, это изменить класс элемента.

1 голос
/ 12 января 2013

У меня была такая же проблема, и я наткнулся на этот вопрос. Решением может быть просто добавление тега <style> со свойствами css в тело документа.

$('<style> p::selection{ background-color:#000; } p::-moz-selection{ background-color:#000; }</style>').insertAfter('body *:last');

Возможно, это не самый элегантный способ сделать это, но, по крайней мере, он работает.

0 голосов
/ 12 декабря 2011

Если вы можете перейти на использование классов вместо прямой установки цвета из JavaScript, сделайте это, потому что это намного проще.

В противном случае см. Этот вопрос: Установка правил псевдокласса CSS из JavaScript

Использование библиотеки из этого ответа : 

jss('p::selection', {
    color: '#3c3'
});

http://jsfiddle.net/thirtydot/uKdPM/9/

0 голосов
/ 12 декабря 2011

::selection - это псевдокласс CSS , а не селектор jquery!

Вы не можете сделать это $('p::selection').css({color: "#3c3"}) и ожидать, что цвет выделения текста будет изменен.

  • $(<selector>) позволяет гибко выбирать элементы dom, используя идентификаторы, классы CSS, атрибуты ...

  • :hover, :after ... ::selection - это CSS-псевдо-селектор, который позволяет вам разрабатывать элементы.

Несмотря на то, что синтаксис селектора jquery может выглядеть так же, как псевдокласс css, они отличаются.

Кстати, программно изменить стиль псевдоклассов css невозможно (например, :hover ...).

...