How to add lightbox effect?

  • Aori
    Inactive member
  • Topic Author
  • New Member
  • New Member
More
13 years 5 months ago #9542 by Aori
Sorry if my question is stupid, I'm not a developer, but I really need to open images in a carousel with lightbox. If someone did this, please share the experience!

Please Log in to join the conversation.

More
13 years 5 months ago #9557 by ivan.milic
You would have to modify modules\mod_hot_joomla_carousel\tmpl\default.php

there is code like this in two places:
Code:
echo '<li><img src="'.$carouselImagesPath.'/'.$infinite_pic[$loop].'" alt="" width="'.$imageWidth.'" height="'.$imageHeight.'" /></li>';

you would need to wrap <img tag with <a href="..." ><img ... /></a></li> .
You could create folder for big images as sub folder of folder used by carousel. Then href attribute for a you coud make as:

<a href=".$carouselImagesPath.'/FOLDER_NAME/'.$infinite_pic[$loop]."

On the end you wold need to call this script:

jQuery(document).ready(function(){
if(jQuery('.hotcarousel .foo A')[0])
jQuery('.hotcarousel .foo A').lightbox();
});
The following user(s) said Thank You: Zantrolhos

Please Log in to join the conversation.

More
13 years 2 months ago #11868 by Zantrolhos
hi,

i'm a newbie. i want to know how do i change the fade effect.

for example, i have 3 images and the 3 images appear at the same time, i want them to appear one by one. how can i do it? :x

hope you can help!
thanks in advance

Sorry for my poor english.

cumps,
Rui gomes

Please Log in to join the conversation.

More
13 years 2 months ago - 13 years 1 week ago #11882 by ivan.milic
To change animation type use "Transition Effect" parameter, you can chose between slide and fade. For number of displayed images use "Number of images on screen" parameter.
Last edit: 13 years 1 week ago by ivan.milic.

Please Log in to join the conversation.

  • ele_
    Inactive member
  • New Member
  • New Member
More
13 years 1 week ago #13198 by ele_
Hi, me too i would like to add lightbox to joomla carousel, when i click i would like to open the large image into a lightbox.

Can you teach me, how to?
thank'you.

Eleonora

Please Log in to join the conversation.

More
13 years 1 week ago - 13 years 1 week ago #13224 by ivan.milic
You first need to have lighgbox reference added.

Then you need to alter carousel php , open:

modules\mod_hot_joomla_carousel\tmpl\default.php

Code:
for ($loop = 0; $loop <= $infinite_pics_number; $loop += 1) { $pic_type = explode(".", $infinite_pic[$loop]); if ((($pic_type[1]=="jpg")or($pic_type[1]=="gif"))or(($pic_type[1]=="jpeg")or($pic_type[1]=="png"))) { echo '<li><img src="'.$carouselImagesPath.'/'.$infinite_pic[$loop].'" alt="" width="'.$imageWidth.'" height="'.$imageHeight.'" /></li>'; echo "\n"; } }

change to:

Code:
for ($loop = 0; $loop <= $infinite_pics_number; $loop += 1) { $pic_type = explode(".", $infinite_pic[$loop]); if ((($pic_type[1]=="jpg")or($pic_type[1]=="gif"))or(($pic_type[1]=="jpeg")or($pic_type[1]=="png"))) { echo '<li><a href="'.$carouselImagesPath.'/'.$infinite_pic[$loop].'" ><img src="'.$carouselImagesPath.'/'.$infinite_pic[$loop].'" alt="" width="'.$imageWidth.'" height="'.$imageHeight.'" /></a></li>'; echo "\n"; } }


then you need to add script to create lightbox:

<script type="text/javascript">
jQuery(document).ready(function(){
jQuery(function() {
if(jQuery('.hotcarousel UL LI a')[0])
jQuery('.hotcarousel UL LI a').lightBox();
});
});
</script>


you can just add this script block at the end of that default.php

If you can not handle this by yourself we can do custom job for you.
Last edit: 13 years 1 week ago by ivan.milic.

Please Log in to join the conversation.

Time to create page: 0.101 seconds
Powered by Kunena Forum