我在sharepoint 2010中有一个图像滚动Web部件，当用户点击图像时，如何放大图像。 [英] I have a image scroll web part in sharepoint 2010, how do I enlarge the image, when a user clicks on the image.

问题描述

我在SharePoint 2010中有一个图像滚动Web部件，当用户点击图像时，如何放大图像。（有点像，当你google图像时，当你点击特定图像时，图像得到放大，页面变得模糊。



图片来自sharepoint图片库。



这里是我用于图像滚动的。



我尝试过：

I have a image scroll web part in SharePoint 2010, how do i enlarge the image, when a user clicks on the image.(Something like, when you google a image, and when you click on particular image, the image gets enlarged and the page becomes blurred.

the images are coming from the sharepoint picture lib.

here is what i am using for image scroll.

What I have tried:

<div style="width:auto; height:400px; overflow:hidden; ">
   
   <marquee style="height:350px;overflow:hidden"  direction="up" >
        
        <asp:Literal ID="ltrImage" runat="server">        
</marquee>
</div>

代码落后：

code behind:

using (SPSite site = new SPSite(SPContext.Current.Web.Url))
            {
                using (SPWeb web = site.OpenWeb())
                {
                    SPList PicLib = web.Lists.TryGetList("ImageScroll");
                    string Image = "<table>";
                                        SPListItemCollection listcol = PicLib.Items;
                    foreach (SPListItem item in listcol)
                    {

                       
                        Image += "<tr><td><img src='" + web.Url + "/" + item.Url + "' style='height:auto;width:350px;'/></td></tr>";

                    
                    }

                    //Title1 += "</table>";
                    Image += "";
                    ltrImage.Text = Image;


                }
            }

推荐答案

循环后你将图像设置回来在将其分配给ltrImage.Text之前将其设置为空字符串。你应该做的是将你的表添加到div标签的innerHTML而不是text属性。看看你的代码和标记的变化。

After your loop you are setting Image back to an empty string before you assign it to your ltrImage.Text. What you should be doing is adding your table to the innerHTML of a div tag instead of the text property. Have a look below at the changes to your code and markup.

<div style="width:auto; height:400px; overflow:hidden; ">
   
   <marquee style="height:350px;overflow:hidden"  direction="up" >
        
        <div id="ltrImage" runat="server"></div>     
</marquee>
</div> 

using (SPSite site = new SPSite(SPContext.Current.Web.Url))
            {
                using (SPWeb web = site.OpenWeb())
                {
                    SPList PicLib = web.Lists.TryGetList("ImageScroll");
                    string Image = "<table>";
                                        SPListItemCollection listcol = PicLib.Items;
                    foreach (SPListItem item in listcol)
                    {                        
                        Image += "<tr><td><img src="" + web.Url + "/" +      item.Url + "" style="height:auto;width:350px;" /></td></tr>                    
                    }                    
                    ltrImage.innerHTML = Image; 
                }
            }</table>

还要注意我最后是如何关闭标签的。有一种更好的方法来编码，但这至少应该得到你去。

这篇关于我在sharepoint 2010中有一个图像滚动Web部件，当用户点击图像时，如何放大图像。的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！