Use in Foundation 4 theme
Permalink Browser Info Environment
I just wonder if anyone has tried using DIG in a Foundation 4 theme? The thing is I'm right now in the process of moving an existing site over to a Foundation 4 theme and I experience some jumping in the overlay and also Close button and descriptions are a bit off.
Anyone else experiencing the same problem, or might it be some dumb style I have messed with without knowing?
A short (11 sec) video of the issue: http://www.youtube.com/watch?v=1RWWkQTlIyQ...
Anyone else experiencing the same problem, or might it be some dumb style I have messed with without knowing?
A short (11 sec) video of the issue: http://www.youtube.com/watch?v=1RWWkQTlIyQ...
Type: | Discussion |
---|---|
Status: | In Progress |
Ah... I should have posted back to this yesterday. Thanks for posting back and looking it up though.
I ended up with a different view using foundation.clearing.js instead (included in Foundation) to have it fully responsive and with swipe support on touch devices.
The code below is all you need in view.php (after including foundation.clearing.js in theme footer) if you have lightbox enabled, which I have on all galleries.
I will modify the complete block (controller, add, edit, view etc.) when I get the time as to have less calls and not include fancybox.js when not needed (and also always use original image dimensions on click), but for showing off the functionality with swipe support for the client, the modified view.php is enough.
EDIT:
The above did help with the 'jumping' zoomed image, but the styles for close button and caption is still off.
The site isn't live yet, but hopefully it will be in the next three to four weeks.
I ended up with a different view using foundation.clearing.js instead (included in Foundation) to have it fully responsive and with swipe support on touch devices.
The code below is all you need in view.php (after including foundation.clearing.js in theme footer) if you have lightbox enabled, which I have on all galleries.
<?php defined('C5_EXECUTE') or die(_("Access Denied.")); ?> <div class="deluxe_image_gallery_container"> <ul class="clearing-thumbs" data-clearing> <?php foreach ($images as $img) { ?> <li><a href="<?php echo $img['full_src'] ?> " class="th"><img data-caption="<?php echo $img['caption'] ?>" src="<?php echo $img['thumb_src']; ?>" /></a></li> <?php } ?> </ul> </div>
I will modify the complete block (controller, add, edit, view etc.) when I get the time as to have less calls and not include fancybox.js when not needed (and also always use original image dimensions on click), but for showing off the functionality with swipe support for the client, the modified view.php is enough.
EDIT:
#fancybox-wrap * { box-sizing: content-box; }
The above did help with the 'jumping' zoomed image, but the styles for close button and caption is still off.
The site isn't live yet, but hopefully it will be in the next three to four weeks.
did you find a way to replace correctly the close bouton and arrows?
thanks for your help
thanks for your help
and the transit effect is not really good as well… do you have an idea please?
If that doesn't work and you still are having no luck, can you provide a link to the site?
-Jordan