SharePoint 怎么样实现List的item从下至上滚动，鼠标移上去的时候停止
怎么样实现List的item从下至上滚动，鼠标移上去的时候停止。。如果是用JavaScript要怎么实现呢。实现了怎么用上去？
就是添加一个 Content Editor Web Part在其中加入如下代码:
script type="text/javascript" src="/test/English/Javascript/jquery-1.4.2.min.js"></script> <script type="text/javascript" src="/test/English/Javascript/VerticalScrollingWebPart.js"></script> <script type="text/javascript"> init_fillScrollableDiv({'listGuid':'A4B4E15A-C5B0-47BC-A08B-739CD48FE58A', 'listBaseUrl':'/test/English', 'listViewGuid':'5BD378F4-25D5-4880-9C5B-1667FE43978D', 'viewFields':['Title','MultiLine'], 'viewFieldsStyle':['font-weight:bold','padding:0 0 0 5'], 'divID':'myScrollableDiv', 'divHeight':'250px', 'divWidth':'500px', 'speed':4, 'linkBack':true}); </script>
Parameters explained:
» listGuid: GUID of the source-list
» listBaseUrl: Relative URL to site/subsite. If root site use only two quotes representing a blank string – like this: “”.
» listViewGuid: GUID of the view to use from the source-list – if left empty it uses the default view.
» viewFields: Array of FieldInternalNames to use in the scrolling webpart.
» viewFieldsStyle: Array of styles to match the array of FieldInternalNames above.
» divID: The ID of the scrollable DIV. Can be anything as long as it is unique on the page.
» divHeight: The hight of the scrollable area.
» divWidth: The width of the scrollable area.
» speed: A number representing the scroll speed.
» linkBack: If set to true it adds a link to open the item clicked on.
你要替换这些参数,比如listGuid, listBaseUrl等.
下面是VerticalScrollingWebPart.js的内容,放在相应的目录下:
/* Pulls items from a list view and presents them as a Vertical Scrolling Web Part * --------------------------------------------- * Created by Alexander Bautz * alexander.bautz#gmail.com * http:-//sharepointjavascript-.wordpress.-com * Copyright (c) 2009-2010 Alexander Bautz (Licensed under the MIT X11 License) * v1.2 * LastMod: 14.07.2010 - LastChange: Attempted to fix the overflow issue in IE6 * --------------------------------------------- * Include reference to: * jquery - http-://jquery-.com * VerticalScrollingWebPart.js (this file) * --------------------------------------------- */ function init_fillScrollableDiv(obj){ // Build the div var myDivBuffer = []; myDivBuffer.push("<div style='vertical-align:top;position:relative;overflow:hidden;cursor:default;height:"+obj.divHeight+";width:"+obj.divWidth+"'>"); myDivBuffer.push("<div id='"+obj.divID+"' style='position:relative'></div>"); myDivBuffer.push("</div>"); myDivContainer=myDivBuffer.join(''); document.write(myDivContainer); $(document).ready(function(){ fillScrollableDiv(obj) }); } function fillScrollableDiv(info){ wsBaseUrl = info.listBaseUrl + '/_vti_bin/'; info.animBegin = 0; info.animPart = 0; // Query the list for items var res = queryItemsByViewName(info.listGuid,info.listViewGuid,info.viewFields.concat('ID','FileDirRef')); if(res.count==-1)alert("An error occured - check the parameters \"listGuid\", \"listBaseUrl\" and \"listViewGuid\"."); var finalBuffer = []; var path = ''; $.each(res.items,function(i,item){ var partBuffer = []; if(path==''){ var pathRaw = item['FileDirRef']; path = "/"+pathRaw.substring(pathRaw.indexOf(';#')+2); } $.each(info.viewFields,function(idx,fin){ var style = ''; var thisVal = (item[fin]==null)?'':item[fin]; if(thisVal.indexOf(';#')>-1){ thisVal = thisVal.substring(thisVal.indexOf(';#')+2); } if(info.viewFieldsStyle[idx]!=undefined){ style = " style='"+info.viewFieldsStyle[idx]+"'"; } partBuffer.push("<tr><td"+style+">"+thisVal+"</td></tr>"); }); finalBuffer.push("<hr style='height:1px;color:black' />"); if(info.linkBack){ finalBuffer.push("<table title='Go to item' style='cursor:pointer' "); finalBuffer.push("onclick='javascript:location.href=\""+path+"/DispForm.aspx?ID="+item['ID']+"&Source="+location.href+"\"' "); finalBuffer.push("cellspacing='0' cellpadding='0'>"+partBuffer.join('')+"</table>"); }else{ finalBuffer.push("<table cellspacing='0' cellpadding='0'>"+partBuffer.join('')+"</table>"); } }); var myContents = finalBuffer.join(''); // Update the content in the scrollable div $("#"+info.divID).html(myContents) .mouseenter(function(){ var now = new Date(); info.animPart += (now-info.animBegin); $(this).stop(); }) .mouseleave(function(){ $(this).stop(); var partScr = parseInt($(this).css('top')); scrollMyDiv(partScr,info); }); // Call scroll function scrollMyDiv('',info); } function scrollMyDiv(scroll,info){ info.animBegin = new Date(); var myDiv = $("#"+info.divID); var ch = myDiv.height(); var chpHeight = myDiv.parent().height(); if(scroll==''){ var scroll=chpHeight; } var duration = (ch*(info.speed*10))-info.animPart; myDiv.css({'top':scroll}).animate({"top":-ch},duration,'linear',function(){ info.animPart = 0; scrollMyDiv('',info); }); } // Function to pull items from view function queryItemsByViewName(listName, viewName, viewFields, pagingInfo){ var content = buildQueryContentByViewName(listName, viewName, viewFields, pagingInfo); var result = {count:-1, nextPagingInfo:'', items:[]}; wrapSoapRequest(wsBaseUrl + 'lists.asmx', 'http-://schemas.microsoft-.com/sharepoint/soap/GetListItems', content, function(data){ result.count = $('rs\\:data', data).attr('ItemCount'); result.nextPagingInfo = $('rs\\:data', data).attr('ListItemCollectionPositionNext'); $('z\\:row', data).each(function(idx, itemData){ var fieldValObj = {} $.each(viewFields,function(i,field){ var value = $(itemData).attr('ows_' + field); if(value == undefined) value = null; fieldValObj[field]=value; }); result.items.push(fieldValObj); }); }); return result; } function buildQueryContentByViewName(listName, viewName, viewFields, pagingInfo){ var result = []; result.push('<GetListItems xmlns="http:-//schemas.microsoft-.com/sharepoint/soap/">'); result.push('<listName>' + listName + '</listName>'); result.push('<viewName>' + viewName + '</viewName>'); if(viewFields != null && viewFields.length > 0){ result.push('<viewFields><ViewFields xmlns="">'); $.each(viewFields, function(idx, field){ result.push('<FieldRef Name="' + field + '"/>'); }); result.push('</ViewFields></viewFields>'); } result.push('<queryOptions><QueryOptions xmlns=""><IncludeMandatoryColumns>FALSE</IncludeMandatoryColumns>'); if(pagingInfo != undefined && pagingInfo != null && pagingInfo != '') result.push('<Paging ListItemCollectionPositionNext="' + pagingInfo.replace(/&/g, '&') + '" />'); result.push('</QueryOptions></queryOptions>'); result.push('</GetListItems>'); return result.join(''); } function wrapSoapRequest(webserviceUrl,requestHeader,soapBody,successFunc){ var xmlWrap = []; xmlWrap.push("<?xml version='1.0' encoding='utf-8'?>"); xmlWrap.push("<soap:Envelope xmlns:xsi='http://www.w3.org/2001/XMLSchema-instance' xmlns:xsd='http://www.w3.org/2001/XMLSchema' xmlns:soap='http://schemas.xmlsoap.org/soap/envelope/'>"); xmlWrap.push("<soap:Body>"); xmlWrap.push(soapBody); xmlWrap.push("</soap:Body>"); xmlWrap.push("</soap:Envelope>"); xmlWrap = xmlWrap.join(''); $.ajax({ async:false, type:"POST", url:webserviceUrl, contentType:"text/xml; charset=utf-8", processData:false, data:xmlWrap, dataType:"xml", beforeSend:function(xhr){ xhr.setRequestHeader('SOAPAction',requestHeader); }, success:successFunc }); }
jquery 可以从Jquery的官网下载后防到相应的目录下。