[自己挖坑自己填]中华腔镜泌尿外科杂志电子版里面的一个坑

在lecture下面，左边是视频，右边就是图片，以前这个图片的切换是用nivoslider的，这个插件是把div背景设置为特定图片，所以就算在html里面把img的width和height都设置好仍旧还是没用会出现下面这种情况：

冒出去了 ![Uploading 捕获1_010523.PNG . . .]

这个图片本来应该长这样的：

正确的样子

如果要让图片全部显示，就只能设置背景的尺寸，css里面这样写：

someselector{
  background:url('video/media/vid1/幻灯片1.jpg') 0px 0px/470px 350px no-repeat
}

里面的0px 0px是背景图片左上角坐标，/后面的'470px 350px'就是背景图片的目标大小。

不过nivoslider这东西还真是……不好改啊，看着就想撞墙啊，毕竟也是很久以前的jquery插件了，这个，差不多就行了，因为觉得里面的动画命令还有图片切分命令太烦了，直接新加了一个特效类别：

...
else if (settings.effect == 'none' || vars.randAnim == 'none'){
                      slider.trigger('nivo:animSkippd');
                    }
...

然后额外再写了一个animSkipped的函数：

slider.bind('nivo:animSkippd', function () {
                vars.running = false;
                $(kids).each(function () {
                    if ($(this).is('a')) {
                        $(this).css('display', 'none');
                    }
                });
                if ($(kids[vars.currentSlide]).is('a')) {
                    $(kids[vars.currentSlide]).css('display', 'block');
                }
                console.log(vars.currentSlide)
                if ($(kids[vars.currentSlide]).is('img')) {
                    vars.currentImage = $(kids[vars.currentSlide]);
                } else {
                    vars.currentImage = $(kids[vars.currentSlide]).find('img:first');
                }
                slider.css('background', 'url("' + vars.currentImage.attr('src') + '") 0px 0px/470px 350px no-repeat');

            })

好吧，其实我也不全看得懂这一段东西是干什么的，只是把之前的animFinished函数改了一下，貌似现在能用了呢，不用每次都在ps里面特地把ppt的图片一张一张转换成470x350的尺寸了呢。

但是总觉得这坑还没填实诚的感觉啊。