I'm trying to display exif info inside a div when hovering over a div element in the gallery (image or filename). It's easy enough to do outside of the gallery, but when I try to do it with a div element of the gallery, nothing happens because the content is being served up via jquery.galleriffic.js dynamically.
You can see the effect here when you mouseover the image:
http://forums.dpreview.com/forums/post/50833256
I have the exif info to display in a database, so I just need to know how to show/hide the div when hovering over the image. Trial and error would take me a while, so if you're an expert, I'd appreciate some advice on where to place the .bind("mouseover")... statements in jquery.galleriffic.js
This is a similar question, but the problem wasn't resolved:
jQuery Galleriffic issue with jQuery inline
Add the exif data to the "caption" area (defined in galleriffic.captionContainerSel), and show/hide with css when you hover the slideshow image.
Related
I have a v-dialog that opens when page is loaded. Somehow overlay is lost. The behavior is very similar to this bug report: https://github.com/vuetifyjs/vuetify/issues/7798
But in my case overlay works when v-dialog loads after several seconds of page loading, and overlay is lost only when v-dialog is loaded from the very beginning. So I have to find the way to fix it or to force overlay to be shown together with dialog.
I tried to work with v-overlay (to wrap dialog content there), but it's content is not shown as well, if we try to do this while page is loading.
So how can I fix this or force overlay to work?
I have included the colorbox css and js and it works when I click any image. However, I don't see any button/control on the overlay. It is only the image with dark overlay behind it. What could be going wrong here?
I am doing this in k15t Scroll Viewport for Confluence.
I tried changing the default script values but even that didn't help. Am I supposed to add the controls manually? I don't think so.
I would like to see the default close button along with slideshow effect, etc. that colorbox offers.
I figured it out. Though dumb but still. The default colorbox images (button icons) folder was residing at a location different from where colorbox expected it. So now, I can see the close button at least.
What still remains is - though I have set the colorbox properties right, I still don't see the previous and next buttons on a page with multiple images. What am I missing? It should have shown up by default...
Thank you.
As you can see in the picture. The nav doesn't response on the screen size when I place inside the accordion.
I try to resized it using jQuery when the accordion collapse but it doesn't work also.
Does anyone have a solution to this problem?
IMAGE LINK
I want to make a dynamic animated slider with symbols that contain clickable actions vs a slider image only approach. I would like to use a "next" button and a "back" button that will scroll multiple background images that contain clickable links. I can produce a basic image slider with the back and next buttons, but this approach is limited. Any help on how I can do this in Edge Animate CC will be very appreciated.
I was looking for a very simple slideshow a while ago. Came up with this here:
http://jquery.malsup.com/cycle/
If you want your Slides to contain any clickable items you will be able to simply add them to the sides div. Just set the picture as a background image in CSS and you are free to develop any clickable items infront.
Here is another tutorial that worked fine for me: http://line25.com/tutorials/build-a-simple-image-slideshow-with-jquery-cycle
To me this is easy to understand and if you are used to jQuery at least a little bit this here will work out fine for you.
Task: I wanted to create a simple share button which extends to a share section (F,T,G,P) when clicked.
I failed to let the section slide out of the share button - what I really, really wanted - but managed to let a separate ul element slide out on the right side.
The animation worked… until I set the ul to hide initially via $('.networks').hide();
The sections is intended to only show up after a click, but now after the first click it just "pops open" ignoring the configured slide-out. Sliding only works in both directions (open and close) after clicking on it at least once .
I've uploaded an Example here at Codepen.io and as a jsFiddle.
Side note: the demos are behaving a little bit strange since they appear to only show a slide-in fx. The slide-out fx, with which we start, always looks like it pops open - that's not the case, it works after the second click, so you got to focus your eyes to see it (on a normal browser it visibly works better).
PS: Bonus points if you help me make this slide out of the "share" button. Be aware that I only have rudimentary knowledge of Javascript ( * duck and run * ).
Take a look at this fiddle link.
I changed the display property of the buttons to be inline-block instead of inline.
Elements with display inline can not have a width and i think it was the reason why jQuery was not able to animates the Elements width. I also animated the wrap around the ul instead of the ul.
EDIT: made a fast mockup of the thing sliding out of the button. Changed some css to be on the list elements itself instead of on the a elements, just work through the css and I think it will look ok.
edit forgot the link: link