ps怎么设计导航鼠标 ps设计导航鼠标悬停技巧

2015-02-02 11:15 81 1 收藏

在这个信息化时代，很多人都会玩ps，但那时ps中的很多小秘诀吗，你知道多少呢，下面看看小编今天带来的这个ps教程设计导航鼠标悬停状态吧！很实用哦！

【 tulaoshi.com - PS教程】

　　首先看一下最终效果和分层：

Photoshop教程:设计导航鼠标悬停状态小效果

　　1、背景色设置为#280021，新建图层，利用钢笔工具画如下图形，填充颜色，然后图层样式中的渐变叠加设置如下：

Photoshop教程:设计导航鼠标悬停状态小效果

　　2、新建图层，用椭圆工具在图形上面建一个选区，然后填充白色，如图。

Photoshop教程:设计导航鼠标悬停状态小效果

　　3、取消选区，选择“滤镜”“高斯模糊”把白色进行模糊。具体数值视效果而定，效果如图。

Photoshop教程:设计导航鼠标悬停状态小效果

　　4、把这个图层的混合模式设置为“叠加”，现在看起来过于亮，可以降低一下透明度。然后把超出下面图形的白色去掉。如图。

Photoshop教程:设计导航鼠标悬停状态小效果

　　5、新建图层，按住ctrl单击图形图层得到图形选区，然后选择“编辑”-“描边”对它进行描边设置，如图。

Photoshop教程:设计导航鼠标悬停状态小效果

　　6、将此描边图层的混合模式设置为叠加，透明度设置为40%，视效果而定。如图。

Photoshop教程:设计导航鼠标悬停状态小效果

　　7、接下来先添加上部高光。用钢笔工具新建选区，然后ctrl+enter转换成选区，然后按住ctrl+alt+shift再点击下面图形的图层，使他们两个的选区进行重合，用渐变工具（白色到透明）进行由左上到右下的拖动（这里在拖动的时候要注意，不要拖动的太大，从左上边缘开始拖动到左下边缘为止即可），适当调节透明度为80%。如图所示。

Photoshop教程:设计导航鼠标悬停状态小效果

来源:https://www.tulaoshi.com/n/20150202/137933.html

上一篇： photoshop设计制作水晶小脚丫教程
下一篇： photoshop图层怎么操作 ps图层操作方法图解

看过《ps怎么设计导航鼠标 ps设计导航鼠标悬停技巧》的人还看了以下文章更多>>

MAC如何清洁Mighty Mouse鼠标导航小球

标签：电脑入门

Mighty Mouse鼠标是苹果专用的一款鼠标，有着靓丽的外形，因而受到许多MAC用户的喜爱，不过它也有一个缺点，那就是它的360度导航小球很容易脏，并且不容易清洗。那么该如何清洗Mighty Mouse鼠标的导航小球呢？现在就让系统之家教你一个小方法。清洁Mighty Mouse的滚轮导航小球的方法：首先你需要找一张4A打印纸或是复印纸；有粗纤维或...

PS网页设计:新手入门制作流行漂亮导航

标签： PS PS基础 ps平面设计教程 ps去水印教程

PS网页设计:新手入门制作流行漂亮导航,本教程很简单,适合练习用. 有问题联系图老师最终效果如下制作过程： 1、新建文件，选择径向渐变，设置前景颜色为＃b3a773Tulaoshi.com，背景颜色为＃877948。效果如图： 2、创建圆角矩形（半径为10px）大小为220x50px，颜色#212121，如图： 3、选择图层样式渐变描边，效果如图。 ...

33款CSS3实现的绚丽鼠标悬停效果分享

标签：平面设计海报设计广告设计画报设计签名设计服装设计名片设计画册设计版式设计商标设计

只要你有创意，完全可以使用CSS3来实现漂亮的动效，当然如果配合jQuery，这样会更加强大，实现更多高级绚丽的动画效果。鼠标hover效果是很常用的，虽然很细微的东西，但网站的细节注定的网站的体验，所以也不要忽视这些小细节。今天设计达人网整理了33个使用jQuery与CSS3实现绚丽的鼠标悬停效果，有些是纯CSS3的，这些效果你完全可以用在你的...

鼠标设计作品

标签：工业设计设计素描

screen.width-333)this.width=screen.width-333" border=0 dypop="按此在新窗口浏览图片" width="580"> screen.width-333)this.width=screen.width-333" border=0> screen.width-333)this.width=screen.width-333" border=0 dypop="按此在新窗口浏览图片" width="580"> screen.width-333)this.width=screen.width-333" b...

Flash AS制作创意的鼠标经过的网页导航

标签： FLASH flash教程 autocad教程

本教程用Flash AS来制作鼠标经过的网页导航,效果为鼠标经过-导航条出现,鼠标移开-导航条消失。下面让我们一起来学习教程的代码编写. 下面是AS代码: var my_B:Boolean = false; my_mc.onEnterFrame = function() { if (!my_B) { my_mc.prevFrame(); &...

查看更多精彩>>