I posted a few days ago on this, and have a follow-up issue.

I have 5 text buttons that show picture images when hovered over.

Everything is working ok when testing in both Firefox and Chrome except the images are appearing below the buttons on both browsers.

You're responding to a relative noob both with RSD and in website development in general. I seem to know just enough to paint myself into a small area near the edge of the cliff on a regular basis.

Suggestions on how to get these images to hover above their related buttons appreciated.

The file I'm working with is at this location:
https://www.dropbox.com/s/as7tn80059nna … d.zip?dl=0

Mike

on my chrome browser the images appear above the button, but on firefox yes they are below

you need change the class "top" on the containers to "position-top" or "hover-top
you will also then need to change the section position (where the container is positioned absolute

re-set the " marging top / margin bottom to = auto

you will then need re-size the height of the container to get rid of the scroll bar

Might be a good use case for the accordion component also. You have a nice design by the way.....good content and visuals, informative, and easy to read.

Might even be a good case for a modal window which would also allow for the image to be bigger so that visitors can read it

I will look at the accordion component.

Can you point me to an example of a modal window or video on working with one?

I am aware of the legibility issue, that is next on my list after this one. Changing to one of the above implementations may resolve both...

And thank you for the kind words

I have a video about modal windows, but at the moment I have just had to crash & rebuild my pc (again) the other problem is that it is a bit out of date as I made it a while ago.
what I might do once my pc is fully loaded again is make a video for you using your project, that way you can see what the effect/process is.

You don't have to do the modal window, the accordian is ok too (as twinstream suggests), but you will still have the small size of the image issue.

It shouldn't be too long before I am up & running again,, will let you know when it's up so keep looking or subscribe to this thread to be informed when there is a new post

The video is up
hop along to my site
https://rsdtutorials.com

skip along onto "Video Tutorials"

The video is "The Modal Window & Stuff"

you can select "full Screen from the Youtube controls,, but you will need to increase the quality to the highest resolution (can't seem to get it to automatically adjust)

Just a suggestion for viewing the examples in a modal window.

Wayan Jaya,

Thank you for the excellent video. I've been offline for the past week, but have now completed the site. Your steps worked well for me and I have achieved what I was envisioning.

The one piece I'll add to the video mentioned above, and I'm only mentioning it to help others who may come across this down the line, not as a complaint, The way the modal is constructed with buttons in a subgrid column caused a problem on smaller screens.

I worked through hiding that column and giving the other subgrid column the full 12 span space on smaller screens.

Other than that, the effect this modal used fit my wants perfectly.

Thank you again.
Mike

Hi Mike
Thats great you managed to get something.

I will say also that the video was a demonstration only to give you an idea what could be done, wasn't meant to be a tutorial, therefore I didn't make it responsive, that's why it didn't look good on smaller screens.
The video has been removed now that I know you have seen it, so nobody else will see it and think it is a tutorial.

Thanks for the kind words & good luck with your site