提供了编程的基础技术教程

zl程序教程

您现在的位置是：首页 >  其他

当前栏目

EasyMvc入门教程-基本控件说明（10）图片轮播导航

入门教程 图片 10 说明 基本 控件 导航 轮播
2023-09-11 14:14:14 时间

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

先上图上例子，看效果如下：

实现代码如下：

@{
    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

 

相关文章