SharePoint 门户网站的图片轮播-页面定制

简介: 这个想法是自己突然的一个想法,想想我们经常用SharePoint做门户网站,不知道你们多数项目都是怎么完成的,我们客户要求的效果都还是很严格的,所有展现起来,还是很漂亮的,但是很多时候的效果,还是难以展现,实在让人头疼。

这个想法是自己突然的一个想法,想想我们经常用SharePoint做门户网站,不知道你们多数项目都是怎么完成的,我们客户要求的效果都还是很严格的,所有展现起来,还是很漂亮的,但是很多时候的效果,还是难以展现,实在让人头疼。好在SharePoint还给我们提供了对象模型,我们可以使用web部件来完成展现,不过这不是我们今天的主题,web部件的基本功要求比较高,尤其编程能力,我的编程不好,大学学的C++就不好,自学的asp.net更加一知半解,好了,废话又多了,大家不要见怪啊!我们今天要做的,是通过js脚本来实现图片轮播,看看新浪首页的图片轮播吧,还是可以的,我们呢就用一段js实现,好了,废话不说了,开始动手去做!Come on!!

1、还记得上次我们讨论的SharePoint四个定制页么?!什么。。不记得了,自己回去找找。。

http://www.cnblogs.com/jianyus/archive/2011/10/13/2210977.html

大家参考一下AllItems页得定制,这个我就不多说了,看看,所有的图片都在上面,我们让它动起来!

2、想想js轮播至少需要src,貌似也只需要src,好了,问题就在这,图片都在这了,我们怎么让他轮播呢?!好吧,不卖关子了,就是简单的

document.getElementById("").src;//js语句

这样的js语句就行了,然后我嫩需要做的就是双引号里面的ID了,对吧。好,开动脑筋,怎么获取这个ID,经过很长时间的思考,多张时间呢?!我也不记得了。。反正很长!其实,页面上显示的是四张图片,每张图片都是有xsl语句循环出来的,我们要做的,就是在img标签上,添加一个ID的属性。

<img  src="{@_x76f8__x7247_}" width="95" height="140"/>

就像昨天的img标签,还记得么?!在id上加上 id="p{@ID}" 就是<img id="p{@ID}" src="{@_x76f8__x7247_}" width="95" height="140"/>

我用js alert了一下document.getElementById("p1").src;,确实是图片的路径,没有问题。好了,第一张图片是p1,第二张是p2...类推

3、相信得到这个结果了,大家的js实现图片轮播也就马山可以做了!好了,大家试试看吧。不管你信不信,反正我是信了。下面是我测试的图片轮播,哎,我的样式太差了,好吧,这不是重点。

ps:话说我的水平有限,大家觉得简单不要见笑啊,就是给大家提供一个不同的思路,我的理念是将定制进行到底!拒绝代码!

 

作者:霖雨
出处:http://www.cnblogs.com/jianyus
本文版权归 霖雨和博客园共有,欢迎转载,但请注明出处。

目录
相关文章
|
XML 数据格式
SharePoint 2013 图文开发系列之网站栏
原文:SharePoint 2013 图文开发系列之网站栏   网站栏的本质,就是一个xml的描述文件,所以创建过程,基本就是通过Feature部署一个Xml文件,然后修改Xml文件的网站栏描述。 1、添加新项目,选择SharePoint 2013 空项目,如下图: 2、选择调试网站和解决方...
879 0
|
搜索推荐
SharePoint 2013 入门教程之创建页面布局及页面
原文:SharePoint 2013 入门教程之创建页面布局及页面   在SharePoint的使用过程中,页面布局和页面时很重要的两个概念,主要用于数据个性化展示,下面,我们简单介绍一下SharePoint的页面布局和页面的个性化。
941 0
|
Java
工具网站导航
工具网站导航
105 0
|
搜索推荐
分享7个超棒的免费高质量图标搜索引擎
在工作中,我们经常需要用到图标素材。你也许能搜到很多的图标资源网站,但要找到免费的高质量图标却很难,这就是为什么我今天要与大家分享这些优秀的免费质量图标搜索引擎,相信在这些网站你能找到你要的东西。如果你知道更多更好的网站,欢迎与我们分享!
291 0
分享7个超棒的免费高质量图标搜索引擎
|
搜索推荐 JavaScript 前端开发
分享8个超棒的免费高质量图标搜索引擎
  在工作中,我们经常需要用到图标素材。你也许能搜到很多的图标资源网站,但要找到免费的高质量图标却很难,这就是为什么我今天要与大家分享这些优秀的免费质量图标搜索引擎,相信在这些网站你能找到你要的东西。如果你知道更多更好的网站,欢迎与我们分享! FindIcons FindIcons 是我最喜欢的图标搜索引擎,目前已拥有超过 300,000 个图标资源。
1377 0
|
存储 JavaScript 数据可视化
SharePoint Online 创建门户网站系列之图片滚动
前 言   创建SharePoint Online栏目我们之前已经介绍过了,具体就是内容编辑器方式、自带WebPart方式和JavaScript读取后台数据前台做展示的三种;   但是,对于复杂的展示来说,这些方式还是会比较难以实现,虽然对于首页的图片轮播来说,通过JavaScript方式已经完全能够胜任,但是,我还是想通过这个栏目,为大家介绍如何使用沙盒解决方案创建WebPart,来完成更加复杂的前台展示。
1503 0
|
Web App开发 前端开发
SharePoint Online 创建门户网站系列之首页布局
前 言   SharePoint Online中创建首页布局,一般都是首先将美工提供的效果图,切图成为Html + Css + Script的形式,然后,将所有资源文件传到SharePoint Online的资源库,在Designer中创建页面,添加Html页面,修改引用。
1413 0

相关产品

  • 云迁移中心