这个想法是自己突然的一个想法,想想我们经常用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

本文版权归 霖雨和博客园共有,欢迎转载,但请注明出处。

SharePoint 门户网站的图片轮播-页面定制的更多相关文章

  1. 使用js制作一般网站首页图片轮播效果

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  2. 图片轮播器bcastr4.swf“&”符号的问题

    bcastr4.swf是一个很不错的网页图片轮播器,我一直使用它作为网站首页图片轮播的控件. http://xiaogui.org/bcastr-open-source-flash-image-sil ...

  3. 循序渐进BootstrapVue,开发公司门户网站(4)--- 使用b-carousel-slide组件实现图片轮播以及vue-awesome-swiper实现图片滑动展示

    在BootstrapVue组件库里面,提供了很多对Bootstrap同等类似的组件封装,其中图片轮播可以采用b-carousel-slide组件实现,而有一些小的图片,如客户/合作伙伴Logo或者友情 ...

  4. Jsoup开发网站客户端第二篇,图片轮播,ScrollView兼容ListView

    最近一段日子忙的焦头烂额,代码重构,新项目编码,导致jsoup开发网站客户端也没时间继续下去,只能利用晚上时间去研究了.今天实现美食网首页图片轮播效果,网站效果图跟Android客户端实现如图: 从浏 ...

  5. 史上最全的CSS hack方式一览 jQuery 图片轮播的代码分离 JQuery中的动画 C#中Trim()、TrimStart()、TrimEnd()的用法 marquee 标签的使用详情 js鼠标事件 js添加遮罩层 页面上通过地址栏传值时出现乱码的两种解决方法 ref和out的区别在c#中 总结

    史上最全的CSS hack方式一览 2013年09月28日 15:57:08 阅读数:175473 做前端多年,虽然不是经常需要hack,但是我们经常会遇到各浏览器表现不一致的情况.基于此,某些情况我 ...

  6. 12款经典的白富美型—jquery图片轮播插件—前端开发必备

    图片轮播是网站中的常用功能,用于在有限的网页空间内展示一组产品图片或者照片,同时还有非常吸引人的动画效果.本文向大家推荐12款实用的 jQuery 图片轮播效果插件,帮助你在你的项目中加入一些效果精美 ...

  7. 图片轮播图插件的使用 unslider!!!

    1.百度图片轮播图unslider,第一个就会出现jquery unslider轮播图,点击进去,下载网站提供的文件,解压,内部有我们需要使用的各种js,图片等. 2.在自己的eclipse或者int ...

  8. Nivo Slider - 世界上最棒的 jQuery 图片轮播插件

    Nivo Slider 号称世界上最棒的图片轮播插件,有独立的 jQuery 插件和 WordPress 插件两个版本.目前下载量已经突破 1,800,000 次!jQuery 独立版本的插件主要有如 ...

  9. jquery图片轮播效果(unslider)

    今天做网站(住建局网站)需要用到图片轮播,刚开始想借鉴DTCMS上的,查看CSS与页面代码,呵呵,不复杂,直接复制过来,结果调整半天,页面还是各种乱,没办法,网上找一个吧,于是找到了今天要说的这货un ...

随机推荐

  1. 搜索----Android Demo

    在前面的博客中,小编简单的介绍了,点击发现按钮,自动加载热门的相关数据,成长的脚步从不停歇,完成了发现的功能,今天我们来简单看一下如何在搜索栏中输入关键字,搜索出我们所需要的信息,今天这篇博文小编就简 ...

  2. Android批量打包-如何一秒内打完几百个apk渠道包

    在国内Android常用渠道可能多达几十个,如: 谷歌市场.腾讯应用宝.百度手机助手.91手机商城.360应用平台.豌豆荚.安卓市场.小米.魅族商店.oppo手机.联想乐商.中兴汇天地.华为.安智.应 ...

  3. 3、Android构建仪表测试

    不同于运行于JVM的本地单元测试,仪表测试运行于你的物理设备或虚拟机中.当你需要访问设备的信息(比如Context)或者使用真正的Android framework组件时(比如SharePrefere ...

  4. 1、MyEclipse插件配置以及通过MyEclipse生成表对应的JPA代码

     去除MyEclipse插件的方式是打开:WindowàCustomize Perspective窗口进行插件配置: 取出下图中不常用的插件勾,最终点击OK. 3.点击OK之后显示的效果图如下: ...

  5. 【一天一道LeetCode】#345. Reverse Vowels of a String

    一天一道LeetCode 本系列文章已全部上传至我的github,地址:ZeeCoder's Github 欢迎大家关注我的新浪微博,我的新浪微博 欢迎转载,转载请注明出处 (一)题目 Write a ...

  6. SQL Sever2005卸载问题解决措施

      在安装SQLServer 2005时,曾遇到过SQL database service不能安装类似问题,曾经花费3个小时时间,最终将其安装成功.将其大概纠错过程记录如下,以作为前车之鉴.      ...

  7. Mybatis事务(一)事务管理方式

    Mybatis管理事务是分为两种方式: (1)使用JDBC的事务管理机制,就是利用java.sql.Connection对象完成对事务的提交 (2)使用MANAGED的事务管理机制,这种机制mybat ...

  8. javascript之JSON引入

    JSON: JavaScript Object Notation   JavaScript 对象表示法. 由于现在很多在服务器获取数据,很多都涉及json数据格式,因此学习json非常有必要. * 语 ...

  9. int*p[ ]与int(*p)[ ]的不同

    举例说明: 1)int* p[2] 是一个指向int型的指针数组,即:p是包含两个元素的指针数组,指针指向的是int型. 可以这样来用: #include <iostream> using ...

  10. OC内存管理-OC笔记

    内存管理细节:http://blog.sina.com.cn/s/blog_814ecfa90102vus2.html 学习目标 1.[理解]内存管理 2.[掌握]第一个MRC程序 3.[掌握]内存管 ...