Эффект Hover не работает в IE

Попытка реализовать простой эффект наведения - он отлично работает в Chrome, но не в MSIE. Есть ли альтернатива? Или исправление, которое сделает эту работу в MSIE? Большинство эффектов зависания/опрокидывания, которые я пробовал, имеют эту проблему в IE.Эффект Hover не работает в IE

normalize.css
demo.css
set2.css
font-awesome.min.css

Markup - Страница

<!DOCTYPE html> 
<html lang="en" class="no-js" xmlns:mso="urn:schemas-microsoft-com:office:office" xmlns:msdt="uuid:C2F41010-65B3-11d1-A29F-00AA00C14882"> 
<head> 
     <meta charset="UTF-8" /> 
     <meta http-equiv="X-UA-Compatible" content="IE=edge"> 
     <meta name="viewport" content="width=device-width, initial-scale=1"> 
     <link href='http://fonts.googleapis.com/css?family=Raleway:400,800,500,600' rel='stylesheet' type='text/css'> 
     <link rel="stylesheet" type="text/css" href="../Style Library/css/normalize.css"> 
     <link rel="stylesheet" type="text/css" href="../Style Library/css/demo.css"> 
     <link rel="stylesheet" type="text/css" href="../Style Library/css/set2.css"> 
     <link rel="stylesheet" type="text/css" href="../Style Library/fonts/font-awesome-4.2.0/css/font-awesome.min.css" 
</head> 

<body> 
     <script src="http://html5shiv.googlecode.com/svn/trunk/html5.js" type="text/javascript" ></script> 
     <div class="container"> 

      <div class="content"> 
       <h2>Goliath</h2> 
       <div class="grid"> 
        <figure class="effect-goliath"> 
         <img src="Site%20Documents/23.jpg" alt="img23"/> 
         <figcaption> 
          <h2>Thoughtful <span>Goliath</span></h2> 
          <p>When Goliath comes out, you should run.</p> 
          <a href="#">View more</a> 
         </figcaption>   
        </figure> 
        <figure class="effect-goliath"> 
         <img src="Site%20Documents/24.jpg" alt="img24"/> 
         <figcaption> 
          <h2>Thoughtful <span>Goliath</span></h2> 
          <p>When Goliath comes out, you should run.</p> 
          <a href="#">View more</a> 
         </figcaption>   
        </figure> 
       </div> 
     </div><!-- /container --> 

    </body> 
</html>

Работа правильно в Chrome (курсор парил на правой панели) Working correctly in Chrome (cursor hovered on the right panel)

В MSIE 11, не работает :( in MSIE 11, not working :(

источник

2015-05-26 dankeshawn

Вздох, так много проблем с «не работает в IE» ... с тех пор, как IE7 это было проклятием большинства веб-разработчиков ... Вы пробовали помещать IE в режим edge? '' Также вы получаете какие-либо ошибки в javascript-консоли в IE или когда вы смотрите на источник CSS? – Tschallacka

вы можете направить нас к ручке или странице, чтобы мы могли ее проверить? – Vandervals

@MichaelDibbets, режим края не исправил его - все еще видя проблему. Нет ошибок JS или когда я смотрю в источнике с помощью инструментов dev. – dankeshawn

Поместите разметку через W3C HTML Validator и исправить все ошибки. Internet Explorer особенно не любит недопустимую разметку HTML, и у вас есть незакрытый элемент <div> между прочим.

Ваш последний <link> тег отсутствует, его закрывающая скобка, >.

<link rel="stylesheet" type="text/css" href="../Style Library/fonts/font-awesome-4.2.0/css/font-awesome.min.css"

У вас есть символ пробела внутри href URL на ваши пути CSS запуска W3C ошибки, href="../Style Library/css/normalize.css". Попытайтесь избавиться от этого, переименовав все, что требуется. Play it safe and avoid whitespace within any URL.
Вы не указали конкретно, какие версии Explorer.

источник

2015-05-26 15:22:42 Sparky

Эффект Hover не работает в IE

ответ

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