javascript - 在单独的 div 悬停上缩放图像

标签 javascript jquery html css image

参见:https://jsfiddle.net/8osg70fp/

当鼠标悬停在对面的 div 上时,我想像在 fiddle 中那样缩放页面右侧的图像。

我知道它符合这种格式,但我无法让它发挥作用。

var treecontainer=document.getElementById('treecontainer'); //DIV=TREECONTAINER
$(treecontainer).mouseover(function(){
    /*CHANGE IMAGE'S CSS HERE*/    
});
$(treecontainer).mouseleave(function(){
    /*CHANGE IMAGE'S CSS BACK HERE*/    
});

最佳答案

请看。如果这不是您需要的,请告诉我。

.container {
  display: flex;
  justify-content: space-between;
  margin: 20px;
}

.myhover {
  width: 100px;
  height: 100px;
  background-color: blue;
}

.myhover:hover + .scaleme {
  transform: scale(1.2);
}
<div class="container">
  <div class="myhover"></div>
  <img class="scaleme" src="http://placehold.it/100">
</div>

关于javascript - 在单独的 div 悬停上缩放图像,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/44540215/

相关文章:

javascript - 刷新数据表数据

jquery - 如何使用没有固定高度和宽度的 JSSOR slider

css - 中间div占用剩余空间?

JavaScript 不在 PHP 加载的 HTML 上运行

javascript - Angular 2使用onchange创建html元素

javascript - Tooltipster 悬停选择和选项在 IE 中不起作用

javascript - 这个简单的正则表达式确实很慢,为什么?

javascript - 对于 SEO,在 HTML 的开头或结尾包含 JS 文件

javascript - 关于javascript中的输入名称

javascript - 在外部 JS 文件中使用 $ 或 JQuery 关键字