Lightbox automatically applied to image links in UI for ASP.NET AJAX LightBox

Dylan

3 posts

Member since:
Feb 2011

Posted 17 Jan 2014 Link to this post

A common way of interacting with other lightbox libraries is to have a snippet of jquery that applies
the lightbox to all image links on a page. This makes for nice unobtrusive javascript.

Is there a nice clean equivalent of this example using the jquery fancybox library?

<script type="text/javascript">

$(document).ready(function() {

$('a[href*=".png"], a[href*=".gif"], a[href*=".jpg"]').attr('rel', 'gallery').fancybox();

});

</script>

Kostadin

Admin

1733 posts

Posted 22 Jan 2014 Link to this post

Hello Dylan,

Since jquery fancybox is not directly related with RadControls I am afraid that it falls out of scope of our support services. I would recommend you to looks for an answer over the internet or directly contact the support on their official website. Additionally if you have any questions related with RadLightBox control we will be glad to help you further.

Regards,
Kostadin
Telerik

If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to the blog feed now.

Dylan

3 posts

Member since:
Feb 2011

Posted 03 Feb 2014 in reply to Kostadin Link to this post

I'm not asking for support regarding the fancybox library. I was just referencing it as an example of how other lightwindow/modal jquery plugins use nice clean unobtrusive javascript to convert image links in a page to open in a lightbox rather than in a new tab.

I don't see any jquery method that would do the same with Telerik.Lightbox. You have to do all kinds of ugly stuff on server side to set specific anchor tags to use lightbox.

We managed to work out a system to do this on the server side where we print out the required javascript for each of these links, but if you want lightbox to compete against libraries such as lightwindow2, fancybox, colorbox etc you might consider this for a future release.

Basically, being able to do $('any element reference').telerikLightBox() in javascript to convert any of those elements to use lightbox for their target url.

Kostadin

Admin

1733 posts

Posted 06 Feb 2014 Link to this post

Hi Dylan,

Note that the RadLightBox is not a client widget as fancybox, but is a server control with a client side functionality. I hope in future our developers will invent an implementation of such scenarios.

Regards,
Kostadin
Telerik

If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the UI for ASP.NET AJAX, subscribe to the blog feed now.

Hugo Augusto

56 posts

Member since:
Jul 2004

Posted 18 Feb 2015 in reply to Kostadin Link to this post

Actually, this question makes a lot of sense. Is it possible to attach RadLightbox without having to specify TargetID for each image we want to open, and like in other lightboxes, just specify a css class or an attribute for images we need to open with RadLightbox?

Kostadin

Admin

1733 posts

Posted 23 Feb 2015 Link to this post

Hello Hugo,

I am afraid that this is not possible but you can use the set_currentItemIndex method to access different LightBox images. For instance you can call a function each time when you click an image and pass the index of the image stored in the LightBox collection. Please check out the following code snippet.

<script type="text/javascript">

function openLightBox(index) {

var lightBox = $find('<%= RadLightBox1.ClientID %>');

lightBox.set_currentItemIndex(index);

        lightBox.show();

};

</script>

Regards,
Kostadin
Telerik

Check out the Telerik Platform - the only platform that combines a rich set of UI tools with powerful cloud services to develop web, hybrid and native mobile apps.