记录一次复杂的图片相册集成过程

2021年12月25日，素描图图片集成。

Demo相册已完成，为复杂的ul li形式。使用Bootstraptable引入demo的相册，计划在bootstrap load success方法中动态添加li，发现失败，表现为图片进入li后再进入ul，样式缺失，无法翻页。且由于XpageList和bootstraptable不兼容，导致翻页时发生死循环。随后弃用Xpage使用普通List翻页正常。

使用静态Li直接写入Html页面，也有问题，是jquery兼容问题，需要将该版本的jquey.min.js引入layout，静态li展示成功。但换成动态li就失败，使用Bootstraptable ajax方法翻页时只能用动态li。

动态li相册问题依旧，无样式，不能翻页，点击无法查看大图。

查找网上办法，有人建议使用ul.listview('refresh');这个要引入jqueryMobile，尝试无果，放弃bootstrap方法。选择使用MVC Model加载。

Model加载后，ul li在页面渲染时就完成了，相册效果出现，OK！

但是考虑到添加了低版本的jquey.min.js到layout，会造成其它影响，故此界面不引用Layout了，直接包所有css和js进来，发生奇怪问题，页面滚动条不出现了，后来经过长时间调研发现是bootstrap_default.css中这个样式造成：

.content-page {
    overflow: hidden;
    padding: 0;
    position: relative;
    margin-right: -15px;
    width: 100%;
    padding-bottom: 60px
}

需要把hidden删除才行，但可能会影响其它界面，建议单独做一个css：

.content-page-no-layout {
    padding: 0;
    position: relative;
    margin-right: -15px;
    width: 100%;
    padding-bottom: 60px
}

又发现相册上部的缩略图点击宽度在ie中太大，chrome中正常，发现是相册elasticside.css中.es-carousel-wrapper高度没有定义，给了135高度OK

解决！