Super Image gallery with ajax

Message Topic Search Topic Options Post Reply Create New Topic Printable Version Translate Topic

   If youre using only 1 foto, this is btter because of no pop-ups.
First you add the following two lines to your header.asp in the head of the html:

<!-- Start Clearbox -->
<link type="text/css" rel="stylesheet" href="clearbox/css/clearbox.css" />
<script src="clearbox/js/clearbox.js" type="text/javascript"></script>
<script src="clearbox/js/clsource.js" type="text/javascript"></script>
<!-- Stop Clearbox -->

Then take this attached zip file and extract it in your pc folder (creating pc/clearbox with 3 dirs inside). 2007-03-26_055120_clearbox.zip
Now open pc/viewPrdCode.asp and replace replace line 859 until 888 with the following:

  %>
    <div class="pcShowMainImage">
    <%
    '// If this is the pop window swap out the image for the selection
    if pcv_strPopWindowOpen = 1 then
     pcv_strVariableImage = pcv_strCurrentUrl
    else
     pcv_strVariableImage = pImageUrl
    end if
    %>
    <a href="catalog/<%=pLgimageURL%>" title="<%=pDescription%>" rel="clearbox">
    <img name='mainimg' src='<%=pcv_tmpNewPath%>catalog/<%=pImageUrl%>' alt="<%=pDescription%>" />
    </a>
    </div>

   <% if len(pLgimageURL)>0 then %>
    <div style="width:100%; text-align:right;">
    <% if InStr(Request.ServerVariables("HTTP_USER_AGENT"),"MSIE") OR InStr(Request.ServerVariables("HTTP_USER_AGENT"),"Firefox") then %>
    <a href="catalog/<%=pLgimageURL%>" title="<%=pDescription%>" rel="clearbox">
    <% elseif InStr(Request.ServerVariables("HTTP_USER_AGENT"),"Safari") then %>
    <a href="catalog/<%=pLgimageURL%>" title="<%=pDescription%>" rel="clearbox">
    <% else %>
    <a href="catalog/<%=pLgimageURL%>" title="<%=pDescription%>" rel="clearbox">
    <% end if %>
    <img src="<%=pcv_tmpNewPath%><%=rsIconObj("zoom")%>" border="0" hspace="10">
    </a>
    </div>
   <% end if %>

  <%

This is presuming that you are using the original asp file. Otherwhise look at the code above and try to find it and replace.
What youre doing is, oce you have the css ad js files included in the header of the html, when you add title="some title" rel="clearbox" inside the a-tag linking to any image, you will get the clearbox effect.
Greetz