function setPreview(view) { var previewWidth = 115, previewHeight = 73, previewSrc = 'pages/preview.jpg', preview = $(_thumbPreview.children(':first')), numPages = (view==1 || view==$('#slider').slider('option', 'max')) ? 1 : 2, width = (numPages==1) ? previewWidth/2 : previewWidth; _thumbPreview. addClass('no-transition'). css({width: width + 15, height: previewHeight + 15, top: -previewHeight - 30, left: ($($('#slider').children(':first')).width() - width - 15)/2 }); preview.css({ width: width, height: previewHeight }); if (preview.css('background-image')==='' || preview.css('background-image')=='none') { preview.css({backgroundImage: 'url(' + previewSrc + ')'}); setTimeout(function(){ _thumbPreview.removeClass('no-transition'); }, 0); } preview.css({backgroundPosition: '0px -'+((view-1)*previewHeight)+'px' }); }
时间: 2023-08-20 21:00:24 浏览: 74
ExtJs选中var editor = new Ext.ux.grid.RowEditor详解
4星 · 用户满意度95%
这段代码是 `setPreview` 函数的完整实现,用于设置预览图的样式和背景位置。
函数的主要逻辑如下:
1. 定义预览图的宽度 `previewWidth` 和高度 `previewHeight`,以及预览图的背景图路径 `previewSrc`。
2. 获取预览图的子元素,并存储在变量 `preview` 中。
3. 根据当前视图的值 `view`,确定预览图所占的页数 `numPages`。如果视图值为 1 或者等于滑块的最大值,表示只有一页,否则表示有两页。
4. 根据页数确定预览图的宽度 `width`。如果只有一页,宽度为预览图宽度的一半;如果有两页,宽度为预览图的原始宽度。
5. 对 `_thumbPreview` 添加 `no-transition` 类,并设置其宽度、高度、位置等样式。
6. 设置预览图的宽度和高度。
7. 如果预览图的背景图片为空或者为 none,设置其背景图片为预览图路径,并在延迟 0 毫秒后移除 `no-transition` 类。
8. 设置预览图的背景位置,根据当前视图的值计算 Y 轴偏移量。
该函数的作用是根据当前视图值设置预览图的样式和背景位置。其中的 `_thumbPreview` 和 `$('#slider')` 是需要在其他地方定义或获取的元素或变量,因此需要根据实际情况进行修改和补充。
阅读全文