Здравствуйте, коллеги! Недавно столкнулся со следующей проблемой:
Вообщем, есть блок для выбора картинок, при наведении на картинку должна появляться рамка. Но почему-то при наведении проходит примерно пол секунды перед тем, как рамка появится. Никаких transition-delay нет. В html всего несколько элементов. В чем же дело? С основным блоком тоже жуткие тормоза c transition. Все происходит очень отрывисто и неплавно.
Вот css:
.image_picker__wrapper{
top:0;
position: fixed;
background-color: rgba(40, 40, 40, 0.6);
width: 100%;
height: 100%;
z-index: 9999999;
top:-100%;
}
.image_picker__wrapper .close_button{
display: inline-block;
width: 50px;
height: 50px;
top: 20px;
right: 20px;
background-image: url('../images/icons/close_image_picker_button.png');
background-color: transparent;
}
.image_picker{
width:1620px;
background-color: #535353;
position: absolute;
left:50%;
top:50%;
height: 750px;
margin-top: -325px;
margin-left: -810px;
}
.image_picker img{
width:500px;
cursor: pointer;
vertical-align: bottom;
margin:20px;
position: relative;
}
.image_picker img:hover{
/*box-shadow: 0 0 10px #0ebeff;*/
border:2px black solid;
}
.close_button{
display: inline-block;
width: 20px;
height: 20px;
position: absolute;
top: -20px;
right: 0;
background-color: #393939;
cursor: pointer;
background-image: url('../images/icons/close_button.png');
}
HTML:
<div class="image_picker__wrapper">
<span class="close_button"></span>
<div class="image_picker">
<nav>
<button>Ваша</button>
<button>Ваши картинки</button>
</nav>
<section class="user_pictures">
<?php
$user = $_SESSION["valid_user"];
$projet_name = $_GET['project_name'];
$project_src = "user_pictures/$user/$projet_name";
$dir = opendir("$project_src");
while(($file_name = readdir($dir)) !== false){
if($file_name != "." && $file_name != ".."){
echo "<img src='http://websitebuilder/$project_src/$file_name'>";
}
}
?>
</section>
<section hidden>
<?php
$dir = opendir("templates_pictures");
while(($file_name = readdir($dir)) !== false){
if($file_name != "." && $file_name != ".."){
echo "<img src='http://websitebuilder/templates_pictures/$file_name'>";
}
}
?>
</section>
</div>
</div>
Проблема не в машине. Дело в том, что мой комп проигрывает svg анимации просто идеально, да чего уж там, топовые игры тянет, но с жалким hover проблемы. Как исправить?
Заранее выражаю огромную благодарность всем, кто поможет
Простой
