locked
DYNAMIC LightBox.NET RRS feed

  • Question

  • User896263394 posted

    every one looking to make dynamic lightbox

    you can go here first and download the dll

    http://www.codeplex.com/lbnet/Release/ProjectReleases.aspx?ReleaseId=694

    and you will find example but its static

    if you need to make it dynamic from your database

    first you have to copy the dll in your bin folder and lightboxNet in your root

    then call the dll in your toolbox

     

    <%@ Register assembly="LightBox" namespace="LightBox" tagprefix="lbn" %>
    
     

    drag a ScriptManager on your page

     

    <lbn:ScriptManager ID="ScriptManager1" runat="server" InstallFiles="True" />
    then write this style in the head 
     
        
        <style type="text/css" media="screen">
            body{
            font: 76% 'Lucida Grande', 'Lucida Sans Unicode', Verdana, sans-serif;
            }
        </STYLE>
      </STYLE>
     put your listview
     
    <asp:ListView  ID="ListView1" runat="server" DataSourceID="SqlDataSource1" 
            GroupItemCount="4"  >
                        <LayoutTemplate>
                            <table runat="server" border="0" id="table1">
                            <tr id="groupPlaceholder">
                            <td></td>
                                </tr>
                            </table>
                        </LayoutTemplate>
                        <GroupTemplate>
                            <tr runat="server" id="tablerow">
                                <td id="itemPlaceholder" runat="server">
                                </td>
                            </tr>
                        </GroupTemplate>
                        <ItemTemplate>
                            <td runat="server">
                                 <span style="background-color: #ffffff;color: #00000;">
                          
                                <br />
                                                         <lbn:HyperLink ID="Hyperlink1" runat='server' group="Plants" ImageUrl='<%# Eval("image", "~/character_images/{0}" ) %>'NavigateUrl='<%# Eval("image", "~/character_images/{0}" ) %>'ToolTip='<%# Eval("charachter_name" ) %>'>                                     
                            </td>
                            </span>
                        </ItemTemplate>
                    </asp:ListView>
     
    <?xml:namespace prefix = asp /><asp:ImageButton>and sure you have a sldatasourc1 for your select statement
    </asp:ImageButton>
    Tuesday, October 21, 2008 10:22 AM

All replies

  • User896263394 posted

    no any reply ??? 

    no comment ???

    did any one try it ???

    Tuesday, October 21, 2008 8:15 PM
  • User222690613 posted

    oh man i like it

    nice work[:D][Yes]

    Thursday, October 30, 2008 10:02 AM
  • User-1237418611 posted

    let say that I want small and big pictures of example "yachts" not just big pictures and then resized like small ones...

    And I want to have in database stored  for every "yacht" only folders locations of small and big pictures of every yacht..

    example:

    yachtID=1       yacht=Ferretti570         smallPictureFolder=~/img/Ferretti570/small/             bigPictureFolder=~/img/Ferretti570/big/

    grab small images with some variable in code like:

    string[] smallImages=Directory.GetFiles(smallPictureFolder from Database that is called in page from querystring where yachtID=1) 

     How to connect smallpicture with bigpicture,when I click small picture that it opens me that same big picture,can it be done in that matter that small and big picture have same number in name but just different folder name - how to connect them.....

    Wednesday, January 21, 2009 10:21 PM
  • User1976871830 posted

    I'm using Net 2.0, will this work on repeater controls? thanks

    Thursday, April 16, 2009 10:10 AM
  • User1976871830 posted

    I got it to work on repeater although what i really want is not to load the target aspx page but to directly launch the light box. any ideas?

    Thursday, April 16, 2009 11:15 AM
  • User-1237418611 posted

    I made something different,I have on left side panel with datalist inside with small pictures and on the right side i have formview inside update panel,when I click picture in datalist it only updates formview with big picture...I can post source

     

    Thursday, April 16, 2009 2:07 PM
  • User1976871830 posted

    Yes, please post source marko. I appreciate it. Thanks

    Thursday, April 16, 2009 6:28 PM
  • User-1237418611 posted

    <title>Gallery</title>

     

    <script language="C#" runat="server">

    void Link1_Command(Object sender, CommandEventArgs e)

    {

    //Session["photoID"] = e.CommandArgument.ToString();

    //lbl.Text = e.CommandArgument.ToString();

    //string photoID = e.CommandArgument.ToString();

    SqlDataSource2.SelectParameters["photoID"].DefaultValue = e.CommandArgument.ToString();

    }

    </script>

    </head>

    <body>

    <form id="form1" runat="server">

    <asp:ScriptManager ID="ScriptManager1" runat="server">

    </asp:ScriptManager>

    <br />

    <table>

    <tr>

    <td >

    <asp:Panel ID="Panel1" runat="server" ScrollBars="Vertical" Height="476px"

    HorizontalAlign="Center" Width="158px" >

    <asp:DataList ID="DataList1" runat="server" DataKeyField="photoID"

    DataSourceID="SqlDataSource1" CellSpacing="-1" RepeatLayout="Table" >

    <ItemTemplate>

    <asp:LinkButton ID="Link1" runat="server" OnCommand="Link1_Command"

    CommandArgument='<%# Eval("photoID") %>' onclick="Link1_Click">

    <asp:Image ID="Image1" runat="server" ImageUrl='<%# Eval("smallPhotoUrl") %>'

    ImageAlign="Top" Width="135px" AlternateText='<%# Eval("alt") %>' />

    </asp:LinkButton>

    </ItemTemplate>

    </asp:DataList></asp:Panel>

    <asp:SqlDataSource ID="SqlDataSource1" runat="server"

    ConnectionString="<%$ ConnectionStrings:GalleryConnectionString %>"

    SelectCommand="SELECT * FROM [DestinationGallery] WHERE ([destinationID] = @destinationID)">

    <SelectParameters>

    <asp:QueryStringParameter Name="destinationID" QueryStringField="destinationID"

    Type="Int32" />

    </SelectParameters>

    </asp:SqlDataSource>

    </td>

    <td style="text-align: center" >

    <asp:UpdatePanel ID="UpdatePanel1" runat="server">

    <ContentTemplate>

     

    <asp:UpdateProgress ID="UpdateProgress1" runat="server">

    <ProgressTemplate>

    <img src="img/loading_wh.gif"

    align="middle" alt="" style="position: absolute; width: 518px; height: 388px; top: 70px; left: 170px;" />

    </ProgressTemplate></asp:UpdateProgress>

     

    <asp:FormView ID="FormView1" runat="server"

    DataKeyNames="photoID" DataSourceID="SqlDataSource2" style="text-align: center">

     

    <ItemTemplate>

    <asp:Image ID="Image2" runat="server" ImageUrl='<%# Eval("bigPhotoUrl") %>' />

    <br />

    </ItemTemplate>

    </asp:FormView>

     

    <asp:SqlDataSource ID="SqlDataSource2" runat="server"

    ConnectionString="<%$ ConnectionStrings:GalleryConnectionString %>"

    SelectCommand="SELECT * FROM [DestinationGallery] WHERE ([photoID] = @photoID)">

    <SelectParameters>

    <asp:ControlParameter ControlID="DataList1" Name="photoID"

    PropertyName="SelectedValue" Type="Int32" />

    </SelectParameters>

    </asp:SqlDataSource>

    <asp:SqlDataSource ID="SqlDataSource3" runat="server"

    ConnectionString="<%$ ConnectionStrings:GalleryConnectionString %>"

    SelectCommand="SELECT TOP (1) bigPhotoUrl FROM DestinationGallery WHERE (destinationID = @destinationID)">

    <SelectParameters>

    <asp:QueryStringParameter Name="destinationID"

    QueryStringField="destinationID" />

    </SelectParameters>

    </asp:SqlDataSource>

    </ContentTemplate>

    <Triggers>

    <asp:AsyncPostBackTrigger ControlID="DataList1"

    EventName="SelectedIndexChanged" />

    </Triggers>

    </asp:UpdatePanel>

    </td>

    </tr>

    </table>

    </form>

    </body>

    </html>

    Friday, April 17, 2009 10:30 AM
  • User-1237418611 posted

    I'm using Asp.net 3.5 Framework..

    You need to specify Querystring parametar("destinationID") in page url to load pictures in web page for each destination...

    if you want to load first big picture on page load you need to little modify source code..

    you need..

    protected void Page_Load(object sender, EventArgs e)

    {

    if (!Page.IsPostBack)

    {

    FormView1.DataSourceID =
    "SqlDataSource3";

    }

    else

    {

    FormView1.DataSourceID =
    "SqlDataSource2";

    }

    --------------------------------------------------------------------------------------------

     You need to change SqlDataSource3 SeletCommand to this below ..and that is all..

    <asp:SqlDataSource ID="SqlDataSource3" runat="server" ConnectionString="<%$ ConnectionStrings:GalleryConnectionString %>"

     

    SelectCommand="SELECT TOP (1) DestinationGallery.* FROM DestinationGallery WHERE (destinationID = @destinationID)">

     -----------------------------------------------------------------------------------------------

    if you want to simulate loading big picture on local machine you will add this..........---> you must remove this when you upload it on server 

     

    protected void Link1_Click(object sender, EventArgs e)

    {

    System.Threading.
    Thread.Sleep(1000);

    }

     

     

     

    Friday, April 17, 2009 11:12 AM
  • User1976871830 posted

    Wow, thanks. I just need to digest this code. Just for confirmation, this windows loads inside the lightbox right? I just skimmed through and I didn't see any tag with the "group" or "rel' attribute, i'll figure it out later. In any case, much appreciated.

    Friday, April 17, 2009 12:19 PM