91uu浮云【桌面webapp块的实现方案】

上一节说到这个简单类似网络收藏夹的webos，那么我们要怎么配合后台去实现？

 

91uu浮云【桌面webapp块的实现方案】

 

 

<article style="overflow-x: hidden; overflow-y: hidden; height: 345px; ">
    	<section class="current" style="position: absolute; "></section>
        <section style="position: absolute; ">
        	<ul class="app-list-mod">
            	<li>
			<a href="http://cdc.tencent.com/" title="腾讯CDC" class="app" target="_blank">
			<img src="appICO/icon_tencent_cdc.jpg" alt="腾讯CDC">
			<span class="img-mask"></span>
			<p>腾讯CDC</p>
			</a>
		</li>
            </ul>
         </section>
         <section style="position: absolute; "></section>
</article>

 

看到上面的代码，我们可以看到，桌面容器【article】与每页放应用容器【section】，在到俱体页面的 应用列表【ul.app-list】

 

给出两种简单方案：

 

1、后台放接口异步请求数据，交给前台处理。并生成创建对应该的html块rendTo到 【article】里头

     写好js约定好json格式，更好的给用户体验以极后然的扩展成 接入第三方接口或站点都是可以的。

2、由后台代码直接打印到前台页面上。

     这个写法就有点死，没有太多的js 体验跟后期 的扩展。【目前简单做，一个实例所以webos.91uu.net 选用这个来讲解一个简单开发方式】

 

 

 

那么为什么要这么做？在布局那一块章节，我们可以了解到 这几块的关联关系。

 

section 容器的多少关系到 我们的分页，以及 navs导航 的 对section 块的控制。

 

由section 个数可以初始化  两个区。  【navs区】分屏导航控制 【div.section-turn-wrap】分页区