js编写城市选项切换效果

JavaScript016

js编写城市选项切换效果,第1张

好。

1、效果方面：js编写城市选项切换效果一款JS版网页顶部向下滑出的城市切换导航，仿sohu团购网页顶部的城市导航切换，从顶部向下滑出，效果非常好。

2、范围方面：js编写可以随时查看，应用范围广，方便在其他城市之间切换。

切换卡原理 ：

切换按钮 =>内容容器 =>时间定时器（自动切换） =>鼠标经过事件 or 点击事件

html：需要按钮数个，内容容器数个（层，叠在一起的。也可以用js添加节点来实现）。

首先加载完所有内容容器，只显示一个 ，其它的属性都改为display:none。显示的是display:block。。。

然后再根据鼠标事件来触发隐藏或者显示容器 。

如果需要定时切换 ，那么 把内容容器的 Index 作为数组来循环遍历。 每隔n秒用 时间函数来触发index 的自增行为。