WPF 鼠标移动到图片变大,移开还原,单击触发事件效果
<Grid> <Canvas x:Name="LayoutRoot"> <Image Cursor="Hand" MouseLeftButtonDown="imgLogo1_MouseLeftButtonDown" MouseEnter="imgLogo1_MouseEnter" MouseLeave="imgLogo1_MouseLeave" Canvas.ZIndex="1" x:Name="imgLogo1" Canvas.Left="100" Canvas.Top="60" Height="100" Source="Image/Picture.jpg"> <Image.RenderTransform> <ScaleTransform x:Name="LogoScale" CenterX="90" CenterY="96"> </ScaleTransform> </Image.RenderTransform> </Image> </Canvas> </Grid> |
public partial class Window8 : Window { public Window8() { InitializeComponent(); timer = new System.Windows.Threading.DispatcherTimer(); timer.Interval = TimeSpan.FromMilliseconds(50); timer.Tick += new EventHandler(timer_Tick); } private System.Windows.Threading.DispatcherTimer timer; private ScaleDirection scaleDirection ; void timer_Tick(object sender, EventArgs e) { AdjustScale(scaleDirection, LogoScale); } void AdjustScale(ScaleDirection scaleDirection, ScaleTransform scale) { if (scaleDirection == ScaleDirection.Down) { if (scale.ScaleX < 1.3) { scale.ScaleX += 0.05; scale.ScaleY += 0.05; } else timer.Stop(); } else { if (scale.ScaleX > 1.0) { scale.ScaleX -= 0.05; scale.ScaleY -= 0.05; } else timer.Stop(); } } enum ScaleDirection { Up, Down } private void imgLogo1_MouseEnter(object sender, MouseEventArgs e) { scaleDirection = ScaleDirection.Down; timer.Start(); } private void imgLogo1_MouseLeave(object sender, MouseEventArgs e) { scaleDirection = ScaleDirection.Up; timer.Start(); } private void imgLogo1_MouseLeftButtonDown(object sender, MouseButtonEventArgs e) { MessageBox.Show("test"); } } |
WPF 鼠标移动到图片变大,移开还原,单击触发事件效果的更多相关文章
- CSS3实现鼠标移动到图片上图片变大
CSS3实现鼠标移动到图片上图片变大(缓慢变大,有过渡效果,放大的过程是有动画过渡的,这个过渡的时间可以自定义 <!DOCTYPE html><html> <head&g ...
- 点击图片或者鼠标放上hover .图片变大. 1)可以使用css中的transition, transform 2) 预先设置一个 弹出div. 3)弹出层 alert ; 4) 浏览器的宽度document.documentElement.clientWidth || document.body.clientWidth
变大: 方法一: 利用css属性. 鼠标放上 hover放大几倍. .kecheng_02_cell_content img { /*width: 100px; height: 133px;*/ wi ...
- 黑马day18 鼠标事件&图片变大
有时候我们在淘宝网或者京东商城上浏览要购买的商品的时候当把鼠标移动到图图片上的时候会发现图片放大.然后鼠标移动,图片也会跟着移动,接下来我就使用jquery来实现这样的效果: 这是图片文件夹: < ...
- CSS3实现鼠标移动到图片上图片变大(缓慢变大,有过渡效果,放大的过程是有动画过渡的,这个过渡的时间可以自定义)
转载自:http://blog.csdn.net/u014175572/article/details/51535768 CSS3的transform:scale()可以实现按比例放大或者缩小功能. ...
- CSS3动画@keyframes图片变大变小颜色变化
在我做公司官网的时候也会帮着写一些游戏的静态页,今天产品要求为了突出一个按钮,他要有颜色的变化而且要变大变小,然后我就在网上搜了下呼吸灯和其他的案例,写了个小damo,看着还有些魔性嘞. html: ...
- css3实现逐渐变大的圆填充div背景的效果
手机端现在的一些应用会运用上这样一个效果,就是duang的一下出现一个圆变大直到填充整个div,动感十足. 想到css3的scale属性,就自己来实现一下. <div id="bcd& ...
- 鼠标悬浮在img上让图片变大
样式: <style type="text/css"> img:hover{ transform:scale(1.02,1.02)}</style& ...
- JS实现鼠标移上去图片停止滚动移开恢复滚动效果
这是在做个人站的时候展示项目成果,因为不光需要展示,还需要介绍详细内容,就在滚动展示的地方做了这个效果以便于点开想要看的项目. 首先,要做的是一个需要滚动的区域.我前边写过一个关于图片循环滚动的示例, ...
- android 双击图片变大,缩放功能
package com.example.administrator.myapplicationphotochange; /** * Created by Administrator on 2016/8 ...
随机推荐
- Git 使用技巧(一):合并分支
在合并分支之前最好保证你所有的分支都是最新的,所以你可以使用 git pull origin branchName 来拉取远程仓库到本地仓库. 假如有一个 dev 分支需要合并到 master 分支中 ...
- 十周周末总结 MySQL的介绍与使用
python 十周周末总结 MySQL的介绍与使用 MySQL字符编码与配置文件 查看数据库的基本信息(用户,字符编码) /s windos下MySQL默认的配置文件 my_default.ini 修 ...
- 随机存取文件流--RandomAccessFile
* RandomAccessFile的使用* 1.RandomAccessFile直接维承于java.Lang.Object类,实现了DataInputDataOutput接口* 2.RandomAc ...
- git cherry-pick 总结
git cherry-pick cherry-pick : 精心挑选,挑选一个我们需要的 commit 进行操作.它可以用于将在其他分支上的 commit 移植到当前的分支. 用法: // 复制com ...
- Centos7下安装postgresql(tar包形式安装)
Centos7下安装postgresql(tar包形式安装) 1.官网下载地址: https://www.postgresql.org/ftp/source/ 2.将下载来tar包上传到linux服务 ...
- Windows 2012 R2上搭建IIS管理用户的隔离模式FTP
Windows 2012 R2上搭建IIS管理用户的隔离模式FTP Windows自带的FTP现在可以提供基于非OS用户的管理,这提高了安全性.即使FTP用户名和密码泄露,也不会对操作系统造成进一步的 ...
- Django manage.py 命令详解
manage.py 查看命令的作用的语句 C:\Users\Administrator> python manage.py help Type 'manage.py help <subco ...
- 腾讯云主机安全【等保三级】CentOS7安全基线检查策略
转载自:https://secvery.com/8898.html 注意:注意,注意:处理前请先做备份,处理前请先做备份,处理前请先做备份 1.确保配置了密码尝试失败的锁定 编辑/etc/pam.d/ ...
- fastapi快速入门
fastapi是高性能的web框架.他的主要特点是: 快速编码 减少人为bug 直观 简易 具有交互式文档 基于API的开放标准(并与之完全兼容):OpenAPI(以前称为Swagger)和JSON ...
- nginx反向代理Grafana
官方文旦地址:https://grafana.com/tutorials/run-grafana-behind-a-proxy/ 一级路径 只需要修改nginx配置文件 # this is requi ...