sharepoint 制作图片播放功能

Step 1, Open the home page of the site;
Step 2, Modify the Shared Web Page --> Add a web part;
Step 3, Drag the "Pictures" web part on the page;
Step 4, Modify the settings of the "Pictures" web part;
Step 5, Uncheck "Visible on page" of this web part property to hide this web part
//we need this web part as a data source, so we do not want to show it on page;
Step 6, Repeat Step 2-3 to add a Content Editor Web Part
//pls note u need add this web part below the "Pictures" web part;
// we will put the actual view on this web part;
Step 7, Click the source editor
Step 8, Add the below content in the editor window:

< script >
GenerateFooterContent("thumbnail", true);
document.getElementById("contentthumbnail").style.display="block";
< /script >

Step 9, Save the changes and you will see the below layouts.

同样根据http://intranetservername/sites/samplesite/Pictures/Forms/slidshow.aspx?ViewStyle=slideshow.的ＨＴＭＬ代码可以发现其中的代码

<span ID=selectionCacheMgr class=userdata></span>
<span ID=DebugBox></span>
<script>
urlCmdForDisplay = ctx.displayFormUrl + "?RootFolder=";
RecursiveViewHeaderScript("slideshow",
210,
160,
160);
currentPicture = 0;
RecursiveViewFooterScript();
</script>
<script language="Javascript">if (fImglibJssLoaded) SlideShowContent();

就是动态显示图片的．
于是修改第八步

<span ID=selectionCacheMgr class=userdata></span>
<span ID=DebugBox></span>
<script>
urlCmdForDisplay = ctx.displayFormUrl + "?RootFolder=";
RecursiveViewHeaderScript("slideshow",
210,
160,
160);
currentPicture = 0;
RecursiveViewFooterScript();
</script>
<script language="Javascript">if (fImglibJssLoaded) SlideShowImg();ToggleRepeat();
StartSlideShow();</script>

SlideShowImg()；－－SlideShowContent()会显示控制工具栏．在imglib.js中增加一个function

//只显示图像，不显示按钮
function SlideShowImg()
{
//debugger
    if (ids.length == 0)
        return;
    SortIds();
    if (currentPicture < 0)
        currentPicture = 0;
    if (currentPicture >= ids.length)
        currentPicture = ids.length - 1;
    var str = "<TABLE cellspacing=0 cellpadding=0 valign=middle align=center width=100% dir="  + listDirection + " height=100%>";
    str += "<TR height=" + listInfo.webImageHeight + ">";
    str += "<TD width=15>&nbsp;</TD>";    
    str += "<TD id=cellImage align=center valign=middle width=" + listInfo.webImageWidth + ">";
    str += "<img onload='ShowSlidePic();' id=thisPic galleryimg=false src=\'" + items[ids[currentPicture]].webimage + 
                "\' + width=" + GetWidth(items[ids[currentPicture]].imgWidth, items[ids[currentPicture]].imgHeight, listInfo.webImageWidth, listInfo.webImageHeight) + 
                " height=" + GetHeight(items[ids[currentPicture]].imgWidth, items[ids[currentPicture]].imgHeight, listInfo.webImageWidth, listInfo.webImageHeight) +  ">";
    var preloadStr = "<img id=nextPic style='position:absolute;visibility:hidden' width=10 height=10";
    if ((currentPicture + 1) < ids.length)
    {
        preloadStr += " src=\'" +  items[ids[currentPicture + 1]].webimage + "\'";
        preloadStr += " onload='fNextImageLoaded=true;'";
    }
    preloadStr += " >";
    str += preloadStr;
    str +="</TD>";
    str += "<TD width=15>&nbsp;</TD><TD valign=top><TABLE class=ms-formdescription cellspacing=2 style='position:absolute;visibility:hidden' >";
    str += "<TR height=40><TD>" + L_Picture_Text + " <a id=currentCount>1</a> " + L_Of_Text + " " + ids.length + "</TD></TR>";
    str += "<TR id=controlRow><TD>";
    var prevGif = "";
    var nextGif = "";
    var playGif = "";
    if (fRTL)
    {
        prevGif = "plnext1.gif";
        nextGif = "plprev1.gif";
        playGif = "plplayr1.gif"
    }
    else
    {
        prevGif = "plprev1.gif";
        nextGif = "plnext1.gif";
        playGif = "plplay1.gif"
    }
    var buttonStr = "<img border=0 height=23 style='position:relative;cursor:hand' onmouseover='HiliteButton()' onmouseout='DemoteButton()' src=\'" + ctx.imagesPath;
    var strPlay = "<a onclick='StartSlideShow(); return false;' href='javascript:StartSlideShow()'>" + buttonStr + playGif + "\' id=playButton alt='" + L_SlideShowPlayButton_Text + "'>" + "</a> ";
    var strPause = "<a onclick='PauseSlideShow(); return false;' href='javascript:StartSlideShow()'>" + buttonStr + "plpause1.gif" + "\' alt='" + L_SlideShowPauseButton_Text + "'>" + "</a> ";
    var strStop = "<a onclick='StopSlideShow(); return false;' href='javascript:StopSlideShow()'>" + buttonStr + "plstop1.gif" + "\' id=stopButton alt='" + L_SlideShowStopButton_Text + "'>" + "</a> ";
    var strPrev = "<a onclick='PreviousSlide(); return false;' href='javascript:PreviousSlide()'>" + buttonStr + prevGif  + "\' alt='" + L_SlideShowPrevButton_Text + "'></a> ";
    var strNext = "<a onclick='NextSlide(); return false;' href='javascript:NextSlide()'>" + buttonStr + nextGif + "\' alt='" + L_SlideShowNextButton_Text + "'></a>";
    if (fRTL)
    {
        str += strPrev + strNext + strStop + strPause + strPlay;
    }
    else
    {
        str += strPlay + strPause + strStop + strPrev + strNext;
    }
    str += "<HR></TD></TR>";
    str += "<TR><TD><B>" + L_FileName_Text + ":&nbsp</B></TD></TR><TR><TD id=tdCaption width=75%>" + items[ids[currentPicture]].caption + "<BR></TD></TR>";
    str += "<TR><TD><B>" + L_ImageCreateDate_Text + ":&nbsp</B></TD></TR><TR><TD id=tdImgDate>" +  items[ids[currentPicture]].createdDate + "<BR></TD></TR>";
    str += "<TR><TD><B>" + L_Description_Text + ":&nbsp</B></TD></TR><TR><TD id=tdDesc>" + items[ids[currentPicture]].description + "<BR></TD></TR>";
    if (ids.length > 1)
        currentPicture ++;
    str += "</TABLE></TD>"
    str += "</TR></TABLE>";
    document.write(str);
    
}

ToggleRepeat();--循环
StartSlideShow();－－开始