jmpress幻灯片的制作中问题解决

iteye_9297

于 2012-04-26 22:45:16 发布

阅读量151

点赞数

CC 4.0 BY-SA版权

分类专栏：默认类别文章标签： jmpress left

本文链接：https://blog.youkuaiyun.com/iteye_9297/article/details/82324570

默认类别专栏收录该内容

1 篇文章

订阅专栏

本文详细介绍了如何使用jmpress.js调整幻灯片布局，包括改变图像大小及幻灯框宽度的方法，并提供了CSS代码示例。通过替换特定CSS属性，可以实现图像占据幻灯片一半空间的效果，同时灵活调整幻灯框的宽度以适应不同展示需求。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

1、当幻灯片中的图像总是显示一半，然后通过jmpress.js查找:


		css(area, {
			top: '50%'
			,left: '100%'
			,perspective: '1000px'
		});

替换为


		css(area, {
			top: '50%'
			,left: '100%'
			,perspective: '1000px'
		});

原因在于启动是jmpress设置图像占50%空间，然后剩下一半可以嵌入别的内容。
2、改变幻灯框的宽度：
改css中的两个类的高度属性：


.jms-slideshow {
	position: relative;
	width: 100%;
	max-width: 1400px;
	min-width: 640px;
	margin: 20px auto;
	height: 400px;
}
.jms-wrapper {
	width: auto;
	min-width: 600px;
	height: 400px;
	background-color: #fff;
	box-shadow: 0 2px 6px rgba(0, 0, 0, .2);
	-webkit-background-clip: padding;
	-moz-background-clip: padding;
	background-clip: padding-box;
	border: 10px solid #fff;
	border: 10px solid rgba(255, 255, 255, 0.9);
	outline: none;
	-webkit-transition: background-color 1s linear;
	-moz-transition: background-color 1s linear;
	-o-transition: background-color 1s linear;
	-ms-transition: background-color 1s linear;
	transition: background-color 1s linear;
}