余大侠在劈柴 2022-10-27 11:52 采纳率: 100%
浏览 94
已结题

前端怎么用vue让图片悬停放大呢?

img


鼠标放在图片上,图片放大,并且可以随着鼠标移动而倾斜悬停,请问用Vue可以怎么做呢

  • 写回答

3条回答 默认 最新

  • 崽崽的谷雨 2022-10-27 13:34
    关注

    给 图图片或者图片父级 加一个 mouserOver事件 然后 加一个 样式 改变 图片宽高

    mouseleave事件 里 宽高 恢复原样
    应该还得加个 z-index层级

    或者 纯 css 加css3动画

    https://blog.csdn.net/mazai5080/article/details/124228506

    https://www.jianshu.com/p/5946f13da9e2

    https://www.cnblogs.com/gracexin/p/16151831.html

    本回答被题主选为最佳回答 , 对您是否有帮助呢?
    评论 编辑记录
  • 「已注销」 2022-10-27 14:16
    关注
    
    img:hover{
                    transform: scale(130%);
                }
    

    最简单的方法,大小自己调整

    评论
  • 人间小美味695 2022-10-27 17:15
    关注
    
    transform:rotateX/Y/Z(270deg);旋转
    transform:scale(2);缩放
    transform:translate(-50%,-50%);移动        
    transform:skew(45deg);倾斜
    transform:matrix();统一简写(旋转 缩放 移动 倾斜)
    

    transform的2D转换和3D转换,参考:https://www.runoob.com/cssref/css3-pr-transform.html

    评论
查看更多回答(2条)

报告相同问题?

问题事件

  • 系统已结题 11月4日
  • 已采纳回答 10月27日
  • 创建了问题 10月27日

悬赏问题

  • ¥15 matlab中此类型的变量不支持使用点进行索引
  • ¥15 咨询第六届工业互联网数据创新大赛原始数据
  • ¥15 Pycharm无法自动补全,识别第三方库函数接收的参数!
  • ¥15 STM32U575 pwm和DMA输出的波形少一段
  • ¥30 android百度地图SDK海量点显示标题
  • ¥15 windows导入environment.yml运行conda env create -f environment_win.yml命令报错
  • ¥15 这段代码可以正常运行,打包后无法执行,在执行for内容之前一直不断弹窗,请修改调整
  • ¥15 C语言判断有向图是否存在环路
  • ¥15 请问4.11到4.18以及4.27和4.29公式的具体推导过程是怎样的呢
  • ¥20 将resnet50中的卷积替换微ODConv动态卷积