2010-03-14 3 views
3

Ключевое слово Я имею в виду то, что вы делаете с текстом, когда вы наводите на него курсор. Если вы используете imgur.com, тогда вы знаете, чего я хочу. Я ничего не могу найти об этом, это расстраивает. Помогите?как выделить текст при зависании

Редактировать: Хорошо, я думал, что сделал это достаточно ясно, но, думаю, нет. I не означает, что я хочу изменить цвет фона при наведении. Это тривиально. Но вы знаете, когда у вас есть текст на странице, и вы нажимаете на текст и перетаскиваете мышь, или вы нажимаете ctrl + A, чтобы цвет фона менялся, и вы можете копировать текст? Вы знаете, подчеркивая? Выбор? Я не хочу, чтобы это смотрите, как это происходит, меняя фоновый цвет, я хочу, чтобы он был на самом деле. Загрузите изображение на imgur.com, и вы поймете, что я имею в виду. Обратите внимание, что, когда вы наводите указатель на любую из ссылок на загруженное изображение, текст выбран - вы можете его скопировать.

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

+0

_ «Я ничего не могу найти об этом в любом месте, это расстраивает». _ Мне просто любопытно .. где и что вы искали? –

ответ

-1
<style type="text/css"> 
    .hoverable:hover { 
     background-color: yellow; 
    } 
</style> 

<p>This is some regular text, but if you <span class="hoverable">hover over this bit</span> it will get a yellow background.</p> 
-1
a { 
    color: red 
} 

a:hover { 
    color: blue 
} 

или вы можете также сделать

#myDiv { 
    background-color: red 
} 

#myDiv:hover { 
    background-color: blue 
} 

Просто смотреть IE, иногда хмурится на вас делать такие вещи, как 2-й пример

+2

'Просто наблюдайте за IE, он иногда хмурится, когда вы делаете что-то вроде второго примера' - Обычно IE делает все подряд. Иногда нередко бывает. Это либо всегда, либо никогда. По этому утверждению я предполагаю, что вы ссылаетесь на то, что ': hover' поддерживается только в' 'элементах в версиях ниже IE7. IE7 и IE8 поддерживают ': hover' практически на всех визуализированных элементах. –

0

Для IE, я думаю, что вы все еще можете использовать

window.clipboardData.setData('text',text); 

(проверка свойства window.clipboardData - и, возможно, даже TYPEOF window.clipboardDatasetData - перед использованием).

Что касается FF, раньше использовался взломанный флеш-накопитель, который можно было использовать в качестве обходного пути, но с Flash 10 эта дорога тоже закрыта. Вот ссылка на пример флэш-вещь, и некоторые люди, у которых расстройство, кажется, меняются в зависимости от их версии Вспышка:

http://www.logiclabz.com/javascript/copy-to-clipboard-with-javascript-on-mozilla-firefox-and-ie.aspx

1

Это может или не может иметь значение:

CSS:

::-moz-selection{ background: #B2263A; color:#fff; text-shadow: none; } 

::selection { background:#B2263A; color:#fff; text-shadow: none; } 

Это изменяет цвет подсветки.

2

Вы должны объединить these answers с событием MouseEnter:

function selectElementText(el, win) { 
    el.focus(); 
    win = win || window; 
    var doc = win.document, sel, range; 
    if (win.getSelection && doc.createRange) { 
     sel = win.getSelection(); 
     range = doc.createRange(); 
     range.selectNodeContents(el); 
     sel.removeAllRanges(); 
     sel.addRange(range); 
    } else if (doc.body.createTextRange) { 
     range = doc.body.createTextRange(); 
     range.moveToElementText(el); 
     range.select(); 
    } 
} 
window.onload = function() { 
    var element = document.getElementById('TheElementToHighlight'); 
    element.onmouseover = function(e) { 
     e = e || window.event; 
     var target = e.target || e.srcElement; 
     selectElementText(target); 
    }; 
}; 

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

+0

'mouseenter' - только IE (довольно уверен). 'mouseover' работает. Я отредактировал ваш пример и исправил пару вещей в процессе, и он работает очень хорошо. http://jsbin.com/akudu4/8/edit#preview – lincolnk

Смежные вопросы