Thank you. This works very well. I tried to add an image caption variable with another set/setTo in the same button, like this: set="$:/state/currentCaption" setTo="$cap$" It works but seems a button can only have one set/setTo, so adding this second one for the caption overwrites the image one. So the caption state updates, but the image state doesn't.
Is there a way for me to pass a caption to the ModalImage tiddler in addition to the image source? Michael < On Sunday, September 14, 2014 9:01:26 PM UTC-4, Andreas Hahn wrote: > > Hi Michael, > > under the assumption that you only have one Lightbox open at a time (and > don't stack them), you could archieve the behaviour you want with this: > > <$button message="tm-modal" param="ModalImage" set="$:/state/currentImage" > setTo="http://www.picturesnew.com/media/images/3cc4cc5ef7.jpg";> > [img width="100" > [http://www.picturesnew.com/media/images/3cc4cc5ef7.jpg]]</$button> > > and create the Tiddler "ModalImage" with this content: > > <img src={{$:/state/currentImage}} /> > > (..or similiar, this is just the template to display the image) > > Also you can then substitute the button widget with a macro like this: > > \define lightBox(img, template)<$button message="tm-modal" param="$template$" > set="$:/state/currentImage" setTo="$img$"> > [img width="100" [$img$]]</$button> > \end > > \define lightBoxWithFixedTemplate(img)<<lightBox "$img$" "ModalImage">> > \end > > Which you then can use like this: > > <<lightBox "http://www.picturesnew.com/media/images/3cc4cc5ef7.jpg"; "test">> > > or alternatively this: > > <<lightBoxWithFixedTemplate > "http://www.picturesnew.com/media/images/3cc4cc5ef7.jpg"; >> > > > /Andreas > > Am 15.09.2014 01:16, schrieb Michael Evans: > > Thanks to Dave Gifford's TW5 Mall, I learned about using tm-modal, which > dims and blurs the screen and creates a modal overlay of a designated > tiddler. In layman's terms, it's a built-in lightbox effect. > I tweaked $:/core/modules/utils/dom/modal.js > <#[email protected]_%24%3A%2Fcore%2Fmodules%2Futils%2Fdom%2Fmodal.js> > to > achieve a look I am happy with. You can see an example screenshot here: > http://i.imgur.com/mKk00Bw.png > > By adding the code below to a tiddler, where imgtiddler1 is the name of > a tiddler with an image (or other content) you want displayed modally, you > can achieve this effect. > > <$button message="tm-modal" param="imgtiddler1"> > > [img width="100" [SomeImage.jpg]] > > </$button> > > This is really great. But this means I have to create a tiddler for > every image I want to lightbox this way. > Is it possible to somehow include a variable placeholder within the > tiddler which will be displayed modally, passing along the source of an > image to be displayed? > > I'm not sure really how to do it, but if it's possible it means I can > set up just one image tiddler, instead of dozens. > > Thanks, > Michael > -- > You received this message because you are subscribed to the Google Groups > "TiddlyWiki" group. > To unsubscribe from this group and stop receiving emails from it, send an > email to [email protected] <javascript:>. > To post to this group, send email to [email protected] > <javascript:>. > Visit this group at http://groups.google.com/group/tiddlywiki. > For more options, visit https://groups.google.com/d/optout. > > > -- You received this message because you are subscribed to the Google Groups "TiddlyWiki" group. To unsubscribe from this group and stop receiving emails from it, send an email to [email protected]. To post to this group, send email to [email protected]. Visit this group at http://groups.google.com/group/tiddlywiki. For more options, visit https://groups.google.com/d/optout.
![http://www.picturesnew.com/media/images/3cc4cc5ef7.jpg"](http://www.picturesnew.com/media/images/3cc4cc5ef7.jpg"){kind=link}
