Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 10.03.2016, 13:29
Новичок на форуме
Отправить личное сообщение для Gooody29 Посмотреть профиль Найти все сообщения от Gooody29
 
Регистрация: 10.03.2016
Сообщений: 1

проблема с window.getComputedStyle
Дорое время суток!
вопрос к гуру javascript
есть "код":

<style>
	a { color:rgb(241, 105, 105); }
	a:hover { color:rgb(1, 105, 205); }
</style>
<h1>
	<a href="#" onclick="go(this);">click me and remove the mouse</a>
</h1>
<script>
function go(el)
{
     setTimeout(function()
     {
			var pseudoElt = '::hover';
			//var pseudoElt = ':hover';
			//var pseudoElt = 'hover';
			var elementStyle =  window.getComputedStyle ? window.getComputedStyle(el, pseudoElt) : el.currentStyle;
			console.log('Hover Result: ' + elementStyle.color);
     }
     , 2000);
    var pseudoElt = null;
    var elementStyle =  window.getComputedStyle ? window.getComputedStyle(el, pseudoElt) : el.currentStyle;
    console.log('Not Hover Result: ' + elementStyle.color);
}
</script>



я кликаю по ссылке и убираю курсор мышки, в результате в консоле получаю:
Not Hover Result: rgb(1, 105, 205)
Hover Result: rgb(241, 105, 105)

Как мне получить правильные данные для "hover" и не "hover", не используя setTimeout и вне зависимости от наведения курсора?
Ответить с цитированием
  #2 (permalink)  
Старый 10.03.2016, 13:42
Аватар для destus
Профессор
Отправить личное сообщение для destus Посмотреть профиль Найти все сообщения от destus
 
Регистрация: 18.05.2011
Сообщений: 1,207

Gooody29,
https://developer.mozilla.org/en-US/...tComputedStyle. Вторым параметром передается псевдоэлемент (:after, :before), а не псевдокласс (:hover)
Ответить с цитированием
  #3 (permalink)  
Старый 10.03.2016, 13:45
Аватар для destus
Профессор
Отправить личное сообщение для destus Посмотреть профиль Найти все сообщения от destus
 
Регистрация: 18.05.2011
Сообщений: 1,207

Gooody29,
<style>
	a { color:rgb(241, 105, 105); }
	a:hover { color:rgb(1, 105, 205); }
</style>
<h1>
	<a href="#">click me and remove the mouse</a>
</h1>
	<script>
	var i,j, sel = /a:hover/;
for(i = 0; i < document.styleSheets.length; ++i){
    for(j = 0; j < document.styleSheets[i].cssRules.length; ++j){    
        if(sel.test(document.styleSheets[i].cssRules[j].selectorText)){
                alert(document.styleSheets[i].cssRules[j].style.cssText)
        }
    }
}
	</script>

Последний раз редактировалось destus, 10.03.2016 в 13:50.
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Проблема с радио кнопками px379 Общие вопросы Javascript 8 29.07.2013 09:30
Проблема с обработкой ескольких .hover() anocean jQuery 3 15.06.2012 22:43
Проблема с Popup окном vovuslik jQuery 5 12.06.2010 16:12
Проблема с дизайном после отправки xmlhttprequest, Проблема с дизайном после отправки cyberx AJAX и COMET 3 01.05.2010 17:07
Проблема с CSS COKOJIOB (X)HTML/CSS 5 04.08.2009 14:19