图片轮播导航大家一定很常见,尤其是中小型建站系统的必备神器。。:)

先上图上例子,看效果如下:

实现代码如下:

@{
var data = new List<PhotoPlayerItem>()
{
new PhotoPlayerItem()
{
Title = "公司产品一",
Src = "http://zwc.cn/images/up_images/5.jpg",
Href = "http://zwc.cn"
},
new PhotoPlayerItem()
{
Title = "公司产品二",
Src = "http://zwc.cn/images/up_images/5.jpg",
Href = "http://zwc.cn"
}
};
}
@Html.Q().PhotoPlayer().SourceItems(data)

  看到没有,基本就是折叠面板的代码“骨骼”搬过来的。。准备数据,调用EasyMvc的PtotoPlayer组件。。。是不是还是很简单呢?如果不简单请告诉我,一定修改。。:)

小技巧:Href一般是链接地址用的,有经验的同学可能会在这里写上一段Javascript语句啥的实现奇淫技巧。。小范围内解决某个问题建议使用,但不建议大范围内使用哦。

本着简单的原则,本模块不再单独增加click事件:)


总结:图片轮播导航同样比较简单,从本文可知:EasyMvc不仅是后台框架,同样,也考虑了前端网站的使用需求,所以,下次公司网站开发类似的模块,尽量用EasyMvc吧 :)

更多使用示例请浏览在线示例:http://core.zwc.cn

EasyMvc入门教程-基本控件说明(10)图片轮播导航的更多相关文章

  1. EasyMvc入门教程-基本控件说明(11)菜单导航

    基本上,是个网站就会有菜单导航,目前流行的菜单是不是这样样子的? 似乎是bootstrap引领的风格,我们就用EasyMvc实现吧,上代码: @{ var data = new List<Men ...

  2. EasyMvc入门教程-基本控件说明(8)提醒导航

    提醒导航顾名思义就是提醒大家注意某些文字了..请看下面的例子: 实现代码如下: @Html.Q().BlockRemind().Text("我可以作为提醒使用") 有的同学会说:这 ...

  3. EasyMvc入门教程-基本控件说明(13)选项卡导航

    选项卡Tab导航主要用于企业页面显示不同子类或者子页面的信息内容. 先来一个基本的使用例子:代码如下: @{ var data = new List<TabItem>() { new Ta ...

  4. EasyMvc入门教程-基本控件说明(12)栏目导航

    栏目导航一般用来显示当前页面所在的模块层级位置关系,如下图所示: 当然也有前端网站作为小栏目导航,凡是没有绝对,只要不违和就好:),下面上代码: @{ var data = new List<N ...

  5. EasyMvc入门教程-基本控件说明(9)引言导航

    休息片刻后,继续开工... 这次我们继续学习引言导航,引言导航主要用于知识点的开始,起到知识点导航的作用.直接例子: 实现代码如下: @Html.Q().BlockRef().Title(" ...

  6. EasyMvc入门教程-图形控件说明(21)线形图+柱状图+饼形图

    本章将介绍一些基本但常用的图形:线型图,柱状图和饼形图. 以上三种图形对于的数据都是键值对数组,请参考第一个例子: @{ var data = new List<LineItem>(); ...

  7. EasyMvc入门教程-基本控件说明(1)按钮

    按钮是我们最常用的控件之一了,先看下我们提供的按钮风格: 不同颜色的: 实现代码: @Html.Q().Button().Text("Danger").ColorDanger() ...

  8. EasyMvc入门教程-基本控件说明(4)折叠面板

    折叠面板一般出现在管理后台,大家用的OutLook里就是用了折叠面板,样子大概是这样的: 把其中的内容替换成图标按钮,是不是就是我们常见的样子了?:)那么如何实现呢?请看例子: @{ var data ...

  9. EasyMvc入门教程-基本控件说明(6)进度条

    进度条的发明是很牛逼的,就如12306采用了队列解决了系统崩溃的问题一样..:) 进度条大家都见过,那么我们先来实现一个简单的进度条,请看例子: @Html.Q().Progress().Value( ...

随机推荐

  1. 使用 CommandScene 类在 XNA 中创建命令场景(十二)

    平方已经开发了一些 Windows Phone 上的一些游戏,算不上什么技术大牛.在这里分享一下经验,仅为了和各位朋友交流经验.平方会逐步将自己编写的类上传到托管项目中,没有什么好名字,就叫 WPXN ...

  2. Vue+Django REST framework打造生鲜电商项目

    1-1 课程导学 2-1 Pycharm的安装和简单使用 2-2 MySQL和Navicat的安装和使用 2-3 Windows和Linux下安装Python2和Python3 2-4 虚拟环境的安装 ...

  3. 如何利用c++编写不能被继承、但可以在类外定义对象的类

    #include <iostream> #include<string> #include<map> #include<vector> #include ...

  4. Python flask几个小问题

    1.这句是个重定向,如果sse_id为空,定向到StudentScoreCenter()这个函数返回的uURL中(就是回到学生分数中心). 2.g是flask一个固定的用法,用来存登陆信息的,你可以简 ...

  5. 【Luogu】P3320寻宝游戏(Splay)

    题目链接 其实这题用Set就完事了但我不会Set 智商-=inf 求虚树上所有边权和的两倍. 具体方式就是splay把所有在虚树上的点存一下,(按照DFS序排序的)每次插入/删除会更新前驱和它.后继和 ...

  6. [POJ3352]Road Construction

    [POJ3352]Road Construction 试题描述 It's almost summer time, and that means that it's almost summer cons ...

  7. Ubuntu 查看默认软件安装位置

    tags: Linux 方法 1:在命令行输入:dpkg -L 软件包名: 方法 2:在/var/cache/apt/archives找的你安装程序的包,然后用gdebi-gtk+软件包名可以查看具体 ...

  8. git merge / rebase 分支的新建与合并

    merge https://git-scm.com/book/zh/v2/Git-%E5%88%86%E6%94%AF-%E5%88%86%E6%94%AF%E7%9A%84%E6%96%B0%E5% ...

  9. Java数据结构-------Map

    常用Map:Hashtable.HashMap.LinkedHashMap.TreeMap 类继承关系: HashMap 1)无序:  2)访问速度快:  3)key不允许重复(只允许存在一个null ...

  10. BZOJ 1497: [NOI2006]最大获利

    1497: [NOI2006]最大获利 Time Limit: 5 Sec  Memory Limit: 64 MBSubmit: 4572  Solved: 2239[Submit][Status] ...