在asp.net中创建photoalbum的概念

时间:2014-06-20 05:31:00

标签: c# asp.net sql webforms

我正在使用c#和SQL Server 2008作为支持在Aspnet webform中创建一个Web应用程序,我需要在该相册中创建包含特定照片的相册,并希望显示所有相册。当用户点击相册时,他/她可以查看所有图像。我能够从数据库中获取所有其他概念,在这里我只想知道创建相册的概念/想法与图像链接到特定的相册

提前致谢。

2 个答案:

答案 0 :(得分:1)

创建一个名为Album_Master的表,该表存储有关相册的所有详细信息。然后创建一个名为Image_Master的第二个表,其中包含有关图像的所有详细信息以及AlbumId到Album_Master表的外键。

在前端,您可以传递用户在querystring参数中点击的相册的ID,然后您可以识别已点击的相册,以便显示该相册的图像。

在后端,您可以创建管理员想要上传图片的相册下拉列表。

答案 1 :(得分:1)

请检查此plugin。可以选择分组图像。在您的应用程序中,列出相册名称并将其链接到该相册的第一张图像。其他图像在子div中列出并通过css隐藏div。所有图像按专辑ID分组。

示例:

<div class="gallery">


        <div class='gallery-block'>
        <div class="gallery-image">  
          <img src='/images/GalleryImages/635272403629062500alhoty.jpg' alt='' class="GalleryImgGroupItem"/>

 <a href='/images/GalleryImages/635272403629062500alhoty.jpg' 
 class='lightview' 
 data-lightview-group='2'
 data-lightview-title="Facilities" 
 data-lightview-caption=" Group Building">
  <div class="link_overlay icon-search"></div>
 </a>

<a href='/images/GalleryImages/63527244427580078117.jpg' 
 class='lightview' 
 data-lightview-group='2'
 data-lightview-title="Facilities" 
 data-lightview-caption="Polymer Laboratory">
  <div class="link_overlay icon-search"></div>
 </a>

 <a href='/images/GalleryImages/63527244408283203116.jpg' 
 class='lightview' 
 data-lightview-group='2'
 data-lightview-title="Facilities" 
 data-lightview-caption="Polymer Laboratory">
  <div class="link_overlay icon-search"></div>
 </a>  

  </div>
  <div class="gallery-details">
  <h2>Facilities</h2>
  <p></p>
  </div>
  </div>

        <div class='gallery-block'>
        <div class="gallery-image">  
          <img src='/images/GalleryImages/63527246491956054626.jpg' alt='' class="GalleryImgGroupItem"/>

  <a href='/images/GalleryImages/63527247704046875028.jpg' 
 class='lightview' 
 data-lightview-group='8'
 data-lightview-title="Our Rich Heritage" 
 data-lightview-caption="desc">
  <div class="link_overlay icon-search"></div>
 </a>

  <a href='/images/GalleryImages/63527247315473632827.jpg' 
 class='lightview' 
 data-lightview-group='8'
 data-lightview-title="Our Rich Heritage" 
 data-lightview-caption=" desc 123">
  <div class="link_overlay icon-search"></div>
   </a> 
  </div>
  <div class="gallery-details">
  <h2>Our Rich Heritage</h2>
  <p></p>
  </div>
  </div>



        </div>

我只是通过代码替换值。 这可能会对你有所帮助。