| Autor | Zpráva | ||
|---|---|---|---|
| robbie Profil * |
#1 · Zasláno: 3. 4. 2016, 12:05:38
Ahoj,
poradíte, proč nefunguje :hover efekt, přikládám code css + jquery: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<style type="text/css">
.one {
width: 50px;
height: 50px;
-webkit-transition: all .2s ease-in-out;
-moz-transition: all .2s ease-in-out;
-o-transition: all .2s ease-in-out;
-ms-transition: all .2s ease-in-out;
}
.transition {
-webkit-transform: scale(2);
-moz-transform: scale(2);
-o-transform: scale(2);
transform: scale(2);
}
</style>
<script type="text/javascript">
$(document).ready(function(){
$('.one').hover(function() {
$(this).addClass('transition');
}, function() {
$(this).removeClass('transition');
});
});
</script>
</head>
<body>
<img class="one" src="../Pokoj/20160129_110347.jpg" width="30" height="30" />
<img class="one" src="../Pokoj/20160129_213452.jpg" width="30" height="30" alt="pok2" />
</body>
</html> |
||
| Chamurappi Profil |
#2 · Zasláno: 3. 4. 2016, 12:12:29
Reaguji na robbie:
Chybová konzole ti hlásí, že $ je undefined, ne? Čímpak to asi bude…
Mimochodem, kde máš samotný transition bez prefixu? A proč uvádíš zcela zbytečný -ms-transition a neuvádíš ne-úplně-zbytečný -ms-transform?
A proč celý ten efekt chceš spouštět přes jQuery a ne přes normální :hover?
|
||
| robbie Profil * |
#3 · Zasláno: 3. 4. 2016, 12:56:36
OK, pořešil jsem to třídou :hover , nicmene, predchozi priklad byl uveden na netu, tak jsem ho testoval:
.one:hover {
width: 70px;
height: 70px;
transform:scale(1.1);
-webkit-transform: scale(1.1); /*Chrome,Safari*/
-moz-transform: scale(1.1); /*Moz*/
-o-transform: scale(1.1); /*OPERA*/
-ms-transform: scale(1.1); /*IE9*/
} |
||
|
Časová prodleva: 8 let
|
|||
0