html css js 基础五(锚点)

利用锚点可以实现点击某个位置,显示它对应的位置的文字或者图片,实现类似于定位的效果,锚点用的是id属性;

html css js 基础五(锚点)_第1张图片

这种效果,点击右面滚动条里面的图片,左边对应显示这张图片的大图;具体实现是:

html css js 基础五(锚点)_第2张图片
html代码

左边的图片id和右边图片的a标签的href相对应;

为了不让左边图片出现超过div高度溢出的情况,所以,给左边div加了overflow-y属性,超出部分出现滚动条。

.photo_left{

 width: 100%; height: 100%;  overflow-y: scroll;

}

你可能感兴趣的:(html css js 基础五(锚点))