Spry + lightbox

Hello Folks,
I just got started with spry..My first 2 days, and I love
it...So congrats to the spry team for this new framework..
I was just wondering if anyone manage to make the orginal
lightbox works with spry. Looks like the two libraries do not
coexist easely..Mind you I didn't spend much time diving into it,
but if anyone has already the solution, this would save me some
precious time.
So here is the problem, I have a click enlarge link inside a
spry region calling lightbox..
something like that (just a quick example of what I mean)
<div id="spryRegion" spry:region="dsCatalogue"
class="SpryHiddenRegion">
<div id="spryLoading" spry:state="loading"
align="center"><img src="_layout/img/loader.gif" width="54"
height="55" alt="loading" ></div>
<div id="spryRepeat" spry:state="ready"
spry:repeat="dsCatalogue">
<div id="spryTitle">{item} <a
href="images/image-1.jpg" rel="lightbox" title="my
caption">click to enlarge</a><div>
</div>
Any heads up would be greatly appreciated.

Hey, I'm currently working on a lightbox /
Rico hybrid but I'm thinking
about shifting to the spry framework so that I can rock the new
HTML Data Set support. My grand scheme is to create a visually
appealing (lightbox) gallery which would allow contribute users
(CMS) to update content. Currently there is nothing like this
available and I have a need for it so I figure, why not.
I plan on waiting until 1.5 is released though so hopefully
we're not looking at a great deal of time. Anyhow, once 1.5 is
released, I'll get it integrated and post src code so you can
utilize it. The contribute integration in my version will not
impact your overall goal, it just so happens that the client is
already using and loves contribute. Rather than this information
coming in via XML or JSON, I'll have contribute friendly external
xhtml formatted "data" for them to edit.
Thanks,
-Mike Ellan
Senior Portal Developer
[email protected]

Similar Messages

Spry Lightbox widget?

Having been a Spry user for a long time (since it came out) I
have been waiting and waiting to hear the news about a lightbox
widget to be included.
I've read here and there about it being around the corner or
next release.
I really don't want to go with a mix of javascript solutions
but would rather keep it all within Spry.
However I need to rebuild my website in the near future and I
am trying to get some information if I can expect a solution to be
included soon.

foxleygd wrote:
Thanks Ben for your email .jscript you say - i will search around to get
some answers . I want more scripts like that .
can I ask you - why there aren't thousands of cool widgets around . It
seems like the future and has been used for a good few years. I would imagine
it to be the ultimate shareware so that everyone can have a cool webpage .
rgds James.
Hi James,
How right you are, cool widgets is the way to go.
How about joining the Adobe Spry User Group (ASUG) and work towards achieving our goal. For more info see Arnout's article here. The more souls the more the rewards.
Greetings,
Ben

LightBox widgets and Spry

In a previous post, Adobe Spry Team had announced a Spry
LightBox widgets in the 1.6 version ... I have download the last
version today, but I don't see the widget ... will be included in
the next version (1.7) ?
Regards

Hi Michele,
I don't think we said we were going to release one in 1.6,
and if I did, I misspoke.
It's on our list but we haven't started it yet. We have some
image management widgets in mind and the new gallery demos are
starting to lean that way, with the ImageLoader.js and such.
But sorry if we mislead you. It was not intentional.
Donald Booth
Adobe Spry Team

Help sry light box gallery doesn't insert in dreamweaver cs5.5?

I just upgraded to dreamweaver cs5.5 and the spry lightbox gallery widget doesn't load properly ? I drag and drop in design view. All my other adobe programmes are still cs3 flash photoshop etc is this why or what am I doing wrong as all i get on the page is a set of images vertically from the gallery template and no gallery layout? Can anyone help?

Not sure that Spry has a lightbox gallery. I assume that you mean the jQuery LightBox Gallery Widget.
If the assumption is correct, then make sure that you have the following files in the correct folder/directory.
<script type='text/javascript' src='scripts/jquery.js'></script>
<script type='text/javascript' src='scripts/lightbox.js'></script>
<link type='text/css' href='css/lightbox.css' rel='stylesheet'/>
<link type='text/css' href='css/sample_lightbox_layout.css' rel='stylesheet'/>
It is wise to supply a link to your site so that we do not have to make assumptions
Gramps

I just upgraded to dreamweaver cs5.5 and widget doesn't load properly ?

I just upgraded to dreamweaver cs5.5 and the spry lightbox gallery widget doesn't load properly ? I drag and drop in design view. All my other adobe programmes are still cs3 flash photoshop etc is this why or what am I doing wrong as all i get on the page is a set of images vertically from the gallery template and no gallery layout? Can anyone help?

Was my answer here http://forums.adobe.com/message/4339831#4339831 not good enough???
Gramps

Create without hassle tutorials??

Hey everyone i tried reading about small tutorials from user interfaces of creating a portfolio lightbox page. Although are they a way where you can create a lightbox page for your portfolio site from scratch. without having to donate to other users and without having to use dreamweaver widgets. i think it is the be best for me at least. i like to learn how to create a lightbox page for my portfolio web page from scratch. Please let me know if its possible how?!
Thanks!

Hi
What David says is very true, one must measure the amount of time required with the benefits gained, and seriously think about any 'hidden' costs involved.
As an example I am currently writing a css animations driven 3d carousel for images and 'static' svg, which when an image/svg is click upon from the carousel it opens a larger image or an animated svg in a lightbox, (also css animations driven) but so far I have spent over 24hrs on the projects. So if this was for a small budget 'time limited' commercial project, it would not be cost effective, and I should simply use one of the many scripts available for free, (most jQuery or even Spry lightboxes are free).
Admittedly my solution is only 2kb in size, (not counting the images/svg) and all jQuery, (and most other javascript based solutions) are well over 50kb, and do not support svg, but then mine will not work in any browser that does not support css animations!!!
So why am I doing this?
Easy, I gain experience in working with css animations, develop best practices, and can explore fall-back solutions for none supporting css animation browsers, (or just 'dump' them, because as it is mainly for svg I have the option). I will also have a working best solution for mobile/tablet devices once it is finished, (estimated time required = approx another 40hrs) and it is what I have been asked to do.
But would you, (or anyone else) be willing to spend one and a half weeks, developing, testing and debugging, in not just desktop browsers but in 3 or 4 different tablet devices, (add the cost of these to your time) for nothing?
In 5-6 years 99% of browsers in use will support css animations and svg, so to add to your willingness to learn javascript, remember that what you learn now regarding lighboxes, may not be relevant to requirements in the future, when css animations/transitions/transforms can replace many javascript effects, including menus/accordions/tabs.
PZ

Spry with LightBox script

Hello all, I am new into spry framework but I managed to use
it with prototype, lightbox and scriptaculous.
The question is how can I access the {ds_RowID} and
{ds_RowCount} from Javascript?
I am using the following that works but returns Script Error.
var myCurRow = eval('{ds_RowID}');
var myTotalRow = eval('{ds_RowCount}');
if ( (myCurRow+1) >= myTotalRow) {
localinit();
I am using the following to create the XML instanses:
var dsGalleries = new
Spry.Data.XMLDataSet("/ssp_director/galleries.php",
"galleries/gallery");
var dsGallery = new
Spry.Data.XMLDataSet("/ssp_director/galleries.php",
"galleries/gallery");
var dsPhotos = new
Spry.Data.XMLDataSet("{dsGalleries::@file}",
"gallery/photos/photo");
Thank you for your help.
Yiannis

Hi Yiannis,
You want to do something like this:
var myCurRow = dsPhotos.getCurrentRow().ds_RowID;
var myTotalRow = dsPhotos.getRowCount();
--== Kin ==--

Need a little help with Slimbox (Lightbox clone) and Spry data sets

Hello guys!
First of all let me say that I'm not a programmer in any way,
shape or form, and somehow I managed to build me a dynamic
thumbnail gallery that reads data from an XML file and displays it
on my webpage using a Spry data set and a slider widget (yay!)
This is of course only thanks to the many great examples
provided by the Adobe Spry team, and me being stubborn enough to
keep at it, even though I don't really understand what I'm doing :D
But I got to this point where I have basically everything
working, except that I can't get the Slimbox (Lightbox clone)
script to work with the Spry-generated thumbnail gallery.
From what I could understand from other threads on this
forum, is that I need to add an observer somewhere, only that I'm
not sure where and how (those threads are pretty old and the
examples aren't available anymore).
I'm sure you guys know what I'm talking about, anyway, here's
what I got so far:
http://www.riotdesign.com.ar/misc/gallery/test1.html
I have the thumbnail gallery populated from the external XML
file, a basic page navigation using the Sliding Panels widget, and
the Slimbox script which works only on the static test image.
Okay I guess that's it for now, sorry for the long post and
of course any help with this will be GREATLY appreciated :)
Thanks & bye!

Kev,
Where exactly does the .evalScripts = true; text need to go?
Does it go in the href call?
<a href="ManageNotes.asp" title="Manage Notes" onClick="this.blur();
Modalbox.show(this.href, {title: 'Manage Notes', width: 575}); return false;">View your notes.</a>
Thanks for any assistance.
J Bishop

Spry menu / lightbox conflict

I apologize in advance if this is bad forum etiquitte as I have also asked this question on the general Dreamweaver forum.
If you open the following page in IE8:
http://02cada7.netsolhost.com/Stasik_Family_Website/janzofiastasik.htm l
and you go immediately to the pictures and activate lightbox everything looks great. But if you move your mouse over the spry menu first and then try the lightbox images, the spry menu does not fade into the background.
Anyone have any ideas how to fix this?

I had another look at the Spry menu (HTML, JS and CCS) and there is nothing wrong with that side.
You could try to swap the two CSS file around as follows
<link rel="stylesheet" href="lightbox/css/lightbox.css" type="text/css" media="screen" />
<link href="SpryAssets/SpryMenuBarVertical-2.css" rel="stylesheet" type="text/css" />
<link rel="stylesheet" href="lightbox/css/lightbox.css" type="text/css" media="screen" />
But otherwise, you need to seek out the culprit within the lightbox plug-in.

Spry and Lightbox II

I just finished a photo Gallery using Spry and Lightbox, any
feedback would be greatly appreciated.
http://www.daishocreative.com/ourWork/index.html
Thank you and happy Holidays

This is what you get with script disabled:
http://www.projectseven.com/cs4public/spgalusable.gif
You also need a loading image to indicate something is
happening when you
click a thumbnail and your VCR controls are not apparent
enough.
Al Sparber - PVII
http://www.projectseven.com
The Finest Dreamweaver Menus | Galleries | Widgets
http://www.projectseven.com/go/pop
The Ultimate DW Menu System
"extrem94" <[email protected]> wrote in
message
news:gjavpb$7uf$[email protected]..
>I just finished a photo Gallery using Spry and Lightbox,
any feedback would
>be greatly appreciated.
>
http://www.daishocreative.com/ourWork/index.html
>
> Thank you and happy Holidays

Lightbox 2 and Spry Accordian

Hello,
Does anyone know if there might be an incompatibility issue
with lightbox 2 and spry accordians with Explorer?
compare these 2 pages in explorer
http://www.pearceco.com/bowdoin_square.html
http://www.pearceco.com/bowdoin_square3.html
click on the one bedroom floorplan link (right hand side) in
each
In Explorer on a pc in the second page (the page with the
accordian) sometimes the page won’t even
open... What is most perplexing is that this all worked
before... go figure.
Please help,
elizabeth

>>>>Any thoughts as to why?
Not without seeing the code.
Can you post a link to the page showing the problem
behaviour?
Regards
John Waller

Shadowbox (lightbox) and spry

Hi,
I have a question. I am trying to get spry working with the
new lightbox version: shadowbox but somehow it doesn't work. Here
is my example page maybe someone has a solution.
http://www.jt.nl/media/ew/jtbioscopen/mark/trailers/index.html

Sorry if im not getting the explanations in these post but i
am having real trouble here.
I have a div id="ssc" that is hidden on a page (it is going
to have a detail region from a spry data set named rsSS)
I use thickbox to show that div.
On the main page i have a spry table with each row will have
an edit buttion. This edit button will open the thickbox. and
seeing that the edit button already getting repeated in each row,
by clicking on the button it sets the detail region because it is
in the row that has the onclick event that has the code to set the
detail region.
This code for the button works on other pages i have when it
isnt located in a spry region.
<input type="button" name="button4" id="button4"
value=">"
alt="#TB_inline?height=550&width=700&inlineId=ssc"
title="Add Invoice" class="thickbox"/>
But as soon as you put it in the Spry:Region=" rsSS" that no
longer works. Nothing happens not even an error.
Can someone help me with the coding
Here is my coding that is important
Head-
<script type="text/javascript"
src="../../Scripts/jquery.js"></script>
<script type="text/javascript"
src="../../Scripts/thickbox.js"></script>
<link rel="stylesheet" href="../../css/thickbox.css"
type="text/css" media="screen" />
<script src="../../SpryAssets/xpath.js"
type="text/javascript"></script>
<script src="../../SpryAssets/SpryData.js"
type="text/javascript"></script>
var rsSS = new
Spry.Data.XMLDataSet("../../rstoxml/ssDetail.php?SubID=<?php
echo $row_rsSSphp['SubID']; ?>", "export/row",{useCache:false});
Body-
<div id="ssc" spry:region="ssCont rsSS">
<div spry:choose="choose">
<div spry:when="{ds_RowCount} == 0">
<table width="100%" cellpadding="2" cellspacing="0"
height="111" class="panelRating">
<tr>
<td height="69" align="center"
valign="middle"><strong>There are no
Contacts</strong></td>
</tr>
<tr>
<td height="40" align="center" valign="middle">
<input type="button" name="button3" id="button3"
value="Add Contact"
onclick="document.getElementById('apDiv1').style.display=(document.getElementById('apDiv1 ').style.display==
'block')?'none':'block';" /> </td>
</tr>
</table>
</div>
<div spry:when="{ds_RowCount} > 0">
<table width="100%" cellpadding="2" cellspacing="0"
class="paneltable">
<tr class="panelheaders">
<th width="4%" align="left"> </th>
<th width="20%" align="left"
spry:sort="SubCLName">Name</th>
<th width="15%" align="left">Phone</th>
<th width="9%" align="left">Ext:</th>
<th width="14%" align="left">Cell:</th>
<th width="19%" align="left">Email:</th>
<th width="19%" align="left"> </th>
</tr>
<tr spry:repeat="ssCont" spry:setrow="ssCont"
spry:odd="TBRowOdd" spry:even="TBRowEven" spry:hover="TBRowHover"
>
<td><input type="checkbox" name="DelC[]"
id="DelC[]" value="{ssContactID}" /></td>
<td align="left">{SubCLName}, {SubCFName}</td>
<td><div spry:choose="spry:choose">
<div spry:when="'{SubCPhone}' >
''">{SubCPhone}</div>
<div
spry:default="spry:default">{rsSS::SubPhone}</div>
</div></td>
<td>{SubCExt}</td>
<td>{SubCCell}</td>
<td>{SubCEmail}</td>
<td><input type="button" name="button4"
id="button4" value=">"
alt="#TB_inline?height=550&width=700&inlineId=apDiv2"
title="Add Invoice" class="thickbox"/>
<input type="button" name="Outlook" id="Outlook"
value="Outlook"
onclick="MM_openBrWindow('../../Scripts/vcardSSC.php?ssContactID={ssContactID}','','width =200,height=100')"
/>
<input name="EmailContact" type="button"
id="EmailContact"
onclick="MM_openBrWindow('mailto:{SubCEmail}','','')"
value="Email"/></td>
</tr>
<tr>
<td align="center" valign="middle"
colspan="7"><input type="submit" name="ssContactDel"
id="ssContactDel" value="Delete" />
<input type="button" name="button3" id="button3"
value="Add Contact"
onclick="document.getElementById('apDiv1').style.display=(document.getElementById('apDiv1 ').style.display==
'block')?'none':'block';" /></td>
</tr>
</table>
</div>
</div>
</div>

Lightbox / spry menu conflict

Hoping there is a quick fix for this issue....
If you open the following page:
http://02cada7.netsolhost.com/Stasik_Family_Website/janzofiastasik.html
and you go immediately to the pictures and activate lightbox everything looks great. But if you move your mouse over the spry menu first and then try the lightbox images, the spry menu does not fade into the background.
Anyone have any insights about how to fix this?

rstasik wrote:
Thanks for the suggestion...but I am not quite sure I understand what I should do.
"pls change your style code as below
<div id="overlay" class="sample" style="height: 602px;opacity:0.4;filter:alpha(opacity=40)"></div>"
The div that the spry menu is located in is div id="left".   I don't have a div id called overlay. Or are you suggestiong that I create one?
I am very sorry...but this is all so new to me, that I sometimes make things harder than they have to be.
hi,
pls do one thing, i guess you got lightbox.css
change your css code in your css file as
#overlay{
    position: absolute;
    top: 0;
    left: 0;
    z-index: 90;
    width: 100%;
    height: 500px;
    background-color: #000;
   opacity: 0.5;                    /* Firefox, Safari(WebKit), Opera */
   -ms-filter: "alpha(opacity=50)"; /* IE 8 */
   filter: alpha(opacity=50);       /* IE 4-7 */
   zoom: 1;       /* set "zoom", "width" or "height" to trigger "hasLayout" in IE 7 and lower */
try this

Can Spry Make "Modal" or "Lightbox" Popup Windows?

Here is an example of what I am after:
http://www.asp.net/AJAX/Control-Toolkit/Live/ModalPopup/ModalPopup.aspx
The application I am building in Spry needs to have a modal
window for the user to input settings. I can definitely do this
with some other random JavaScript Kits, but need to keep this
solution clean. I would love it if I could do this with Spry alone.
Does any one know how?

Hello ElMatt,
We have this feature on our short list of things to be
developed in the next 2-3 releases. I understand you perfectly your
reasons to not mix multiple AJAX platforms but unfortunately I
can't offer you anything in this direction right now. Once we will
finish this modal window we will push it into the main Spry
package.
Regards,
Cristian

Spry Conflicts with LightBox and ThickBox?

i have tried to use both Lightbox2 and Thickbox on a page
with a Spry dataset and both will not work (they work fine on
non-Spry pages). It's just a simple gallery-style page. Any ideas
on how to make them compatible?

Sorry for the confusion, but I do have it set up correctly on
my local machine. I only posted the HTML file so you could download
it. I have all the included files in the right locations here
(because it works using either SPRY 1.5 or Slimbox when I test it).
Spry is definitely conflicting with Slimbox. I just made a
simple test file, got slimbox working and slowly added the Spry
pieces. It broke when I added the spry:region call in the div:
<div id="content" spry:region="portfolio_xml">
I don't understand these people that say they are using Spry
and Slimbox without issues. Would be nice to see an example.

Spry + lightbox

Similar Messages

Maybe you are looking for