Has anyone ever used this jquery code with Web Yep Images?
It places a hover text over the image via alt. text.
I just need some help setting it up, where to put specific folders, classes etc.
I’m not using and query right now. I am using a few actions but not sure they are native to Freeway. I believe second party.
Flex Image action, Box Sizing action and Web Yep actions.
Because the site is responsive I need a solution for hover captions. I tried to use the “Sliding Captions” from freeway style but that only works for layers items.
I just need instructions. I’m pretty good at adding outside source code but the jquery solution doesn’t have instructions.
Since I’m using Web Yep I guessing I need to put one of these files into the Web Yep folder. From what I gather it used the alt-text tag.
I have the library source in the of my page.
I’m not sure where to put the folder that contains the js.jquery stuff. I’m using Web Yep Image elements, so I would think maybe they need to go into the opt folder of that program?
I changed the $(‘#default’).capty(); to $(‘.default’).capty(); because I may want to use it in a loop and you can’t have multiple duplicate id’s on the same page
Publish
then in browser populate the wyimage and add text within the alt tag and you should then see that text as a reveal when you roll your mouse over the image.
This doesn’t effect Lightbox functionality either
Ok Max,
Got all of this to work except my image needs to be flexible. The class=flexImage doesn’t work now. Can I put the flexImage class in the css?
Also I discovered that the reason I was having trouble getting this to work earlier was that I had inserted the Web Yep image element into the div. I didn’t realize that you could apply that action to an html div. How did I not know this.
hi billy it’s difficult to see how you are using the class=“flexImage”. I am assuming it goes on the actual img tag and not on a div around the image… but I am guessing here as I am flying blindfolded :o)
So if it is supposed to be on the img tag then you can add it in the webyep extended popup so it would be aded like this
class="default flexImage"
As i said I have no idea how that class is being used? so I have no idea what it will do but that is how a class could be added.
ps converting a normal freeway item has been around since I think version 2 of the actions. They are very useful because freeway does sometimes create a different html structure around inserted items compared to its own html elements.
Yes I have those two classes stated in the Web Yep img tag just as you have it. What is happening is there seems to be some conflict when both are applied. That may mean the javascript may not be playing nice with web yep. If I apply one or the other then the desired effect is achieved, but both, no go.
So I removed lightbox for my Web Yep folder and nothing changed. The flexImage still caused a conflict.
Does Freeway add some lightbox js that I might not be aware of?
Hi billy
I am trying to get it clear in my head what you are trying to do just so I can advise… so if I am wrong then let me know.
What I think you are trying to have is a flexible layout with fluid and reactive webyep images is that correct?
if it is then the scaling images could be done via specifying percentages in freeway and with a bit of extra responsive styles… but the hover reveal is going to be the bigger problem, because that plugin has not been made to be responsive. You would need to adjust the css to make that work.
I have tinkered with the css but there is quite a lot to think about for example if the image scales down 50% what happens to the text… does it need to change size. It will probably need to wrap. the box behind it would need to react to the new multi lines text etc.
An off the shelf system that just plugs in and works to exactly your specification may not be available. It may need real bespoke development.
I would be grateful for any help on this at all. I like to think I can figure some of these things out. I’ve learned so much from you guys in the Forum but I guess once a designer, always a designer. But I do love learning new things. That is a great point about the text, but I think I could live with the stacking.
I actually think my client would be happy with the way I have it now without the flexible images but the issue in my design is that I pick an uneven number of images per/line so it looks crappy on the iPad.