5-2作业题——右侧的导航

5-2作业题——右侧的导航

老师,右侧导航栏可以用什么方法来制作,能够做的更流畅?

我选用了animate的方法,怎样才能将事件只绑定到 li 标签身上,并且把 img 当做不存在。现在每次鼠标滑过 li 时,img 也会触发 mouseover 、mouseout 事件。

<div class="floor-right-nav">
	<ul>
		<li>
			<span>我的</span>
			<img src="images/icon/13.png" alt="">
		</li>
		<li>
			<span>购物车</span>
			<img src="images/icon/14.png" alt="">
		</li>
		<li>
			<span>收藏</span>
			<img src="images/icon/15.png" alt="">
		</li>
		<li>
			<span>消息</span>
			<img src="images/icon/16.png" alt="">
		</li>
		<li>
			<span>回到顶部</span>
			<img src="images/icon/17.png" alt="">
		</li>
	</ul>
</div>


正在回答

登陆购买课程后可参与讨论,去登陆

2回答

先设置好位置,然后再用hover伪类设置鼠标经过的样式。hover是伪元素,跟定位没有关系,但是要实现这个功能需要结合定位、动画以及hover来实现。如果有其他更好的办法,也可以用,总之要条理清晰的去实现,不要一下子全弄出来,容易乱套,一个功能一个功能的实现。祝学习愉快!

  • 秋渡 提问者 #1
    非常感谢!
    2017-09-21 19:23:53
Miss路 2017-09-20 12:04:58

右侧导航用鼠标经过,不用事件,用hover伪类就可以了。祝学习愉快!

  • 提问者 秋渡 #1
    老师是指用:hover,然后设置transition吗?还是不知道怎么实现 如果 html 如上,css已经将摆设正确了,应该在怎么设置:hover 啊?
    2017-09-21 07:58:49
问题已解决,确定采纳
还有疑问,暂不采纳

恭喜解决一个难题,获得1积分~

来为老师/同学的回答评分吧

0 星
请稍等 ...
意见反馈 帮助中心 APP下载
官方微信

在线咨询

领取优惠

免费试听

领取大纲

扫描二维码,添加
你的专属老师