css动态图标布局,无需刷新,类似亚马逊网站

t3irkdon  于 2023-02-20  发布在  其他
关注(0)|答案(1)|浏览(127)

我对样式表还是个新手,所以这可能是个很简单的问题。我注意到亚马逊网站有两个很酷的功能,我想复制一下。
1.在页面的中间,有一个网格,它水平地展示了他们推荐的图标和其他东西。根据页面的宽度,它水平地展示了4个或5个,或者6到8个图标/项目。他们这样做的时候不需要刷新页面。我试着阅读源代码,但是它看起来像是一堆样式表的把戏,使这种情况发生。
1.左边的“按部门购物”也很有趣,如果你的页面很窄,它就会消失,但当你鼠标悬停时它就会显示出来,如果页面很宽,那么它就会显示出来。
如果有人能给我指出正确的方向或一些示例代码,那就太好了。谢谢

z9smfwbn

z9smfwbn1#

问题一:
不仅仅是css。
使用表格在每行中存储任意数量的元素,然后为整个表格设置常规宽度。
使用JavaScript/JQuery根据表的大小计算每个元素的宽度。
问题2:http://www.dynamicdrive.com/style/layouts/item/css-liquid-layout-31-fixed-fluid-fixed/你可能想看看这个,就我在亚马逊网站上看到的,侧边栏从来没有消失过。
编辑:
1.假设你有一个1000px宽的页面,2.从左边开始的200px被设置为侧边栏,3.使用jQuery检查当前页面宽度,4.如果pageWidth〈1000px,侧边栏{display:none;}
但实际上,这些代码在网络上无处不在。

相关问题