`
caibinghong
  • 浏览: 148860 次
  • 性别: Icon_minigender_1
  • 来自: 福建
社区版块
存档分类
最新评论

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】分页区

 

 

 

分享到:
评论

相关推荐

    Qt使用QtWebApp搭建Http服务器实现文件下载

    在本文中,我们将深入探讨如何使用Qt库中的QtWebApp模块来构建一个HTTP服务器,以实现文件的下载功能。Qt是一个强大的跨平台应用程序开发框架,而QtWebApp是其一个扩展,专门用于创建基于Web的应用程序,包括HTTP...

    QtWebApp.zip_OEG_mosth9a_qt http server_qt webapp_qt实现http serve

    **QtWebApp.zip_OEG_mosth9a_qt_http_server_qt_webapp_qt实现http_serve** **一、QtWebApp项目概述** QtWebApp是基于Qt库开发的一个小型HTTP服务器应用程序,由OEG(可能是一个开源组织或个人开发者)的mosth9a...

    webapp框架

    关于标签"webapp",这表明这个框架是针对Web应用程序的,而不是本地桌面应用或移动应用。Webapp通常使用HTML、CSS和JavaScript来构建,有时也会结合现代前端框架如React、Vue.js或Angular,以提供更好的性能和用户...

    cas-server-webapp-4.0.0实现单点登录

    总的来说,`cas-server-webapp-4.0.0` 提供了一个强大且灵活的单点登录解决方案。正确配置和使用它可以极大地提升用户体验,同时简化企业的身份管理。在部署和使用过程中,理解其工作原理、合理配置及安全策略是至关...

    vuerouter实现webApp切换效果

    本文将详细介绍如何利用Vue Router实现"前进时页面从左向右移入,后退时从左往右移出"的WebApp切换效果。 首先,确保你已经安装了Vue.js和Vue Router。如果你的项目还没有集成Vue Router,可以通过以下命令进行安装...

    training/webapp镜像

    training/webapp镜像,方面一些内网用户无法直接pull镜像时下载: 使用方法: docker load -i training-webapp.tar.gz

    QtWebApp应用例程

    在实际项目中,QtWebApp可用于实现以下功能: 1. **数据可视化**:通过HTTP接口提供实时数据,前端通过JavaScript进行数据可视化展示。 2. **设备控制**:控制嵌入式设备或工业自动化系统的状态,比如远程开关、...

    C# Webapp C# WebappC# WebappC# Webapp

    业务逻辑层处理应用程序的核心功能,通过C#编写服务类实现业务规则。数据访问层则与数据库进行交互,例如使用ADO.NET或Entity Framework。 ASP.NET是Microsoft提供的一套用于构建Web应用程序的框架,包含了多种开发...

    基于Vue2实现的网易云音乐MV的webapp

    在本项目中,“基于Vue2实现的网易云音乐MV的Webapp”是一个使用Vue.js框架构建的前端应用程序,旨在模仿网易云音乐的MV功能。Vue.js是目前非常流行的一个轻量级JavaScript框架,以其易学易用、组件化开发、高性能等...

    Web基础——WebApp之初体验(三)

    在本篇关于“Web基础——WebApp之初体验(三)”的文章中,我们将深入探讨Web应用程序(WebApp)的关键概念和技术,以及它们如何为用户提供便捷的在线体验。WebApp是互联网技术的重要组成部分,它们允许用户在浏览器...

    WebApp打包apk、ipa解决方案

    公司做好一个H5的网页版网站,想直接打包成ios 和andrioid的App应用,方法很简单步骤详见我的另一篇博文(http://blog.csdn.net/lxy1106/article/details/79420176),此处为第2步的Hbuilder的解决方案,只需要将该...

    QT实现httpServer功能-QtWebApp

    QtWebApp项目是一个基于Qt库的轻量级解决方案,它使得在C++环境中构建一个具备网页交互功能的HTTP服务器变得相对简单。以下是对这个主题的详细阐述: 首先,Qt是一个跨平台的应用程序开发框架,由Trolltech(现为...

    Webapp 微信骨架

    "桌面也兼修"揭示了Webapp 微信骨架不仅专注于移动端应用,还同时考虑到了桌面端的适配问题,确保在不同平台上都能提供一致的用户体验。这在当前多设备共存的环境中显得尤为重要,使得开发者无需为不同平台编写不同...

    webapp开发综合案例

    1.了解Web工程概念及与传统软件工程的区别 2.理解WebApp的概念、特点和开发过程 3.掌握WebApp的分析、设计和测试方法 4.掌握WebApp综合开发方法及课程设计过程

    webkit webApp 开发技术要点总结

    ### WebKit WebApp 开发技术要点深度解析 在当今移动互联网时代,WebApp因其跨平台性和易维护性,成为开发者构建移动应用的重要选择之一。WebKit作为一款广泛应用于移动设备的浏览器引擎,其对WebApp的支持尤为关键...

    JSP WebApp jsp应用开发好实例

    7. **MVC(Model-View-Controller)设计模式**:学习如何在JSP WebApp中实现MVC架构,分离业务逻辑、视图呈现和控制流程。 8. **数据库连接与操作**:通过JDBC(Java Database Connectivity)连接数据库,执行SQL...

    webApp和壳的接口.docx

    本文将详细解析一个公司内部使用的WebApp与Android壳的接口协议,帮助理解如何在两者之间实现功能的无缝对接。 首先,我们来看一下核心的接口方案。这个协议主要包括两个主要部分:WebApp调用壳的功能(WebApp to ...

    QtWebApp.zip

    - **内部企业应用**:对于需要在公司内部网络中部署的应用,QtWebApp提供了安全、可控的解决方案。 - **实时数据展示**:如监控系统、数据分析平台等,利用WebSocket实现数据的实时更新。 ### 六、进一步学习与开发...

    webapp 页面交互与布局

    在现代互联网世界中,Web应用程序(WebApp)已经成为人们日常生活中不可或缺的一部分。它们不仅提供了丰富的功能,而且在用户体验上越来越接近原生应用。"Webapp页面交互与布局"是构建高效、用户友好的WebApp的核心...

Global site tag (gtag.js) - Google Analytics