Page 1 of 1
Sliding Panel Photo Wall Gallery (Released 12/3/2011)
Posted: Fri Mar 11, 2011 4:55 pm
by smartmedia
Version 1.0.0.0
Build with 2.6.0 Extension builder
More info about the Gallery:
http://tympanus.net/codrops/2010/05/14/ ... th-jquery/
Properties
Futures
Added ability to include image as background to thumb list ( if no image, color will show up )
Added ability to include image as background to image view panel ( if no image, color will show up )
Added ability to change back & next buttons with transparent image. ( Included some, otherwise make your own )
Thumbnails are generated automatically ( You can change the width - height - folder name - prefix or thumbs )
Since this Gallery is fully paged Return link added to return back to your page, also you can change the text.
You can change the color of info bar according your needs.
Download
http://dl.dropbox.com/u/8766047/Sliding ... allery.rar
Re: Sliding Panel Photo Wall Gallery (Working)
Posted: Fri Mar 11, 2011 6:04 pm
by BaconFries
This is untested but it should work as I have used in similar extensions, when using the xsl in the builder please use Type:
Gallery make the Variable: $images$ and insert as shown below in the HTML you will also need to make Varibles for the Height and Width and you will just use one Image for both the Thumbnail and Large... as mentioned I havnt tested this for the script you need the xsl for but it should work...
The HTML
Code: Select all
<div id="thumbsWrapper">
<div id="content" >
$images$
<div class="placeholder"></div>
</div>
Code: Select all
<?xml version="1.0" encoding="UTF-8"?>
<xsl:stylesheet xmlns:xsl="http://www.w3.org/1999/XSL/Transform" version="1.0">
<xsl:output method="html"/>
<xsl:template match='/'>
<xsl:for-each select="GALLERY/IMAGE">
<img src="{FILENAME}" height="{HEIGHT}" width="{WIDTH}" alt="{FILENAME}" title="{TITLE}" /></a>
</xsl:for-each>
</xsl:template>
</xsl:stylesheet>
Re: Sliding Panel Photo Wall Gallery (Working)
Posted: Fri Mar 11, 2011 8:57 pm
by smartmedia
Thanks man, i did it with small changes.
Code: Select all
<img src="{THUMB}" width="{THUMB_WIDTH}" height="{THUMB_HEIGHT}" alt="{FILENAME}" title="{TITLE}" />
Re: Sliding Panel Photo Wall Gallery (Working)
Posted: Fri Mar 11, 2011 11:17 pm
by protectourlands
Looking forward to this one.
Re: Sliding Panel Photo Wall Gallery (Working)
Posted: Sat Mar 12, 2011 10:51 am
by smartmedia
Hi..
BF, do you know how i will center the thumbs in page, right now start from left and because the user can change the width and height of thumbs doesn't look so good, they leave some space empty in right.
Re: Sliding Panel Photo Wall Gallery (Working)
Posted: Sat Mar 12, 2011 2:41 pm
by BaconFries
I would need to take a look at the css it will probably be something in there...or maybe try this
Code: Select all
<img src="{THUMB}" width="{THUMB_WIDTH}px" height="{THUMB_HEIGHT}" px alt="{FILENAME}" title="{TITLE}" />
or
Code: Select all
<img src="{THUMB}" width="100%" height="100%" alt="{FILENAME}" title="{TITLE}" />
Re: Sliding Panel Photo Wall Gallery (Working)
Posted: Sat Mar 12, 2011 3:55 pm
by smartmedia
Thanks BF, i found the solution.
I just put text-align:center; in #content img class and it's done.
Re: Sliding Panel Photo Wall Gallery (Working)
Posted: Sat Mar 12, 2011 8:01 pm
by CJS
smartmedia,
This will make a great addition to the WB extension library. I look forward making use of your good work.
Thanks.
Re: Sliding Panel Photo Wall Gallery (Released 12/3/2011)
Posted: Sun Mar 13, 2011 6:45 am
by smartmedia
Extension is released. Download and enjoy it.
Re: Sliding Panel Photo Wall Gallery (Released 12/3/2011)
Posted: Sun Mar 13, 2011 10:43 am
by smartmedia
Well,
In order to show a different image set for back and next, you must create it with a program like this:
nav.png
nav2.png
Those are the file are used embedded and they are image set, width must be 40px and height 80px. So, both back & next images are 1 file. I hope you understand.
Personally i use RealDraw 5.
Re: Sliding Panel Photo Wall Gallery (Released 12/3/2011)
Posted: Sun Mar 13, 2011 11:36 am
by smartmedia
Please, re download the extension, i have included some nav icons for back and next images.
Re: Sliding Panel Photo Wall Gallery (Released 12/3/2011)
Posted: Tue Mar 15, 2011 3:32 am
by amrajadhyaksha
Good work as always.
My request is about a good accordion. Codrops has a few of these, eg:
http://tympanus.net/Tutorials/ElegantAccordion/
http://www.armagost.com/zaccordion/
WWB has an accordion but it has size restrictions. Would be great to have a full page or at least full legth one.
Thanks, in anticipation.
And oh yes, thanks again for the zooms.
Re: Sliding Panel Photo Wall Gallery (Released 12/3/2011)
Posted: Thu Mar 17, 2011 4:00 pm
by stamjoe
Perfect Chris.
Thanks
Joe
Re: Sliding Panel Photo Wall Gallery (Released 12/3/2011)
Posted: Sun Mar 18, 2012 4:52 pm
by me.prosenjeet
Was trying this gallery. Seems Super!
However, one issue. After adding the images, moment I save the project, the default navigation buttons change and point to another image*. I tried selecting the buttons that come with this extension and save again but still when I reopen the project, the image set is gone and another image* is set as button.
Any idea?