Question

我有点新来了。我目前正在设计一个可以上传专辑等的网站...来自定制的CMS面板...我可以输入数据，路径等...所有完美的工作在CMS部分:)但不幸的是:(我我无法制作单击能力的幻灯片:)例如:)相册的缩略图在幻灯片中:)当我点击然后幻灯片图像它会将我重定向到显示幻灯片图片的页面（路径也存储在数据库中）

我一直试图让这个工作大约2周:(不幸的是我不熟练:(我正在使用VISUAL STUDIO 2013（ASP.NET C＃）

我试过这种方法

<div id="Separator1_Slideshow">

.JS

var i = 1;
function fun() {
    i++;
    document.getElementById("DefaultPlaceHolder_SlideshowImg").src = "Resources/Slideshow/" + i + ".jpg";
    if (i == 4) //here 4 is number of images i want to display in the slide show
    { i = 0; }
}
setInterval("fun()", 7000);`

我找不到附加数据源路径的方法

GallerySTR = ConfigurationManager.ConnectionStrings["PPDB"].ConnectionString;
GalleryCN = new SqlConnection(GallerySTR);'

string LoginQuery = "SELECT * FROM Albums";
GalleryCN.Open();
GalleryCMD = new SqlCommand(LoginQuery, GalleryCN);
GalleryRDR = GalleryCMD.ExecuteReader();
while (GalleryRDR.Read())
{
    Attach Picture To Slideshow and have a clickable function that will redirect to my album content page :)

}
GalleryCN.Close();

Answer 1

我终于做到了！这是我的代码:)只是为了帮助其他可能需要此代码的人;）

JAVASCRIPT

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js" type="text/javascript"></script>
<script src="../Scripts/Gallery.js"></script>
<script>
    RedirectThumbnail = function (RedirectURL)
    {
        var ID = RedirectURL.getAttribute("alt");
        var NAME = RedirectURL.getAttribute("title");
        if (ID == "")
        {
            alert("Please Select An Album");
        }
        else if (NAME == "")
        {
            alert("Please Select An Album");
        }
        else
        {
            window.location.href = "../Pages/ViewAlbum.aspx?ID=" + ID + "&NAME=" + NAME;
        }
    }
</script>

.ASPX

<div class="GalleryAlbums">
    <div class="thumb-image-frame">
        <span class="thumb-image-wrapper">
            <img id='thumb-large-image' alt="" title="" style="cursor:pointer" onclick="RedirectThumbnail(this)" />
        </span>
    </div>
    <div class="list">
        <asp:ListView runat="server" ID="gridList">
            <LayoutTemplate>
                <ul class="thumb-list">
                    <asp:PlaceHolder runat="server" ID="itemPlaceHolder" />
                </ul>
            </LayoutTemplate>
            <ItemTemplate>
                <li>
                    <a class="thumb-link">
                        <img class="thumb-image" src='<%# ResolveUrl(Eval("ThumbnailPath").ToString()) %>' alt='<%# Eval("ID") %>' title='<%# Eval("AlbumName") %>' />
                    </a>
                </li>
            </ItemTemplate>
        </asp:ListView>
    </div>
</div>

.CS

SqlConnection CN;
SqlCommand CMD;
SqlDataReader RDR;
SqlDataAdapter DA;
DataSet DS;
string STR;
string AlbumID, AlbumName,ThumbnailPath;

public List<Photo> Photos = new List<Photo>();// our data source
//our custom picture class
public class Photo
{
    public string Name { get; set; }
    public string Path { get; set; }
    public bool IsDefault { get; set; }
}
protected void Page_Load(object sender, EventArgs e)
{
    LoadAlbums();
}
private void LoadAlbums()
{
    STR = ConfigurationManager.ConnectionStrings["DATABASE"].ConnectionString;
    CN = new SqlConnection(STR);

    string Query = "SELECT * FROM TABLE";
    CN.Open();
    CMD = new SqlCommand(Query, CN);

    DA = new SqlDataAdapter(CMD);
    DS = new DataSet();
    DA.Fill(DS);
    gridList.DataSource = DS;
    gridList.DataBind();

    RDR = CMD.ExecuteReader();
    while (RDR.Read())
    {
        AlbumID = RDR[0].ToString();
        AlbumName = RDR[1].ToString();
        ThumbnailPath = RDR[2].ToString();
    }
    CN.Close();
}

我希望我的代码可以帮助将来有需要的人;）

如何制作可点击的幻灯片，并重定向到数据库中的路径

1 个答案: