search

orion3dgames / gridder

A jQuery plugin that displays a thumbnail grid expanding preview similar to the effect seen on Google Images.
http://orion3dgames.github.io/gridder/
461 stars 130 forks source link

Not visible on mobile #61

Closed mtsweir closed 6 years ago

mtsweir commented 6 years ago

A few issues here, when I preview the demo in Chrome Dev Tools, there is just white space where the grid should appear. What the issue could be is that you override the height of ".gridder-list .image" to auto which essentially removes all heights, if I remove the auto height it then shows the grid.

Another issue is when the one grid element is expanded the content doesn't expand fully and overlaps any grid elements below. I added a min-height to the ".gridder-show" div so I could a least set a manual height, but in the real world, this will always vary.

screen shot 2018-01-13 at 9 26 09 am

![Uploading Screen Shot 2018-01-13 at 9.22.10 AM.jpg…]()

jordan-webdev commented 6 years ago

I am wondering, too, if there is a solution to this. Ideally, this has to be mobile-friendly in order for me to use it on any responsive site. mtsweir, did you come up with any other solution?

orion3dgames commented 6 years ago

This is not a bug and you need to update the CSS to cater your needs, be it responsive or not.

In this example http://oriongunning.github.io/gridder/ , you will see that the expanded content displays correctly.

mtsweir commented 6 years ago

I grabbed the latest from this repo and previewed in Chrome (64) This is what I am seeing...

screen shot 2018-01-31 at 7 56 55 pm

While it kind of works, I need to do many fixes (css resets, style tweaks) just to get it stable.

The http://oriongunning.github.io/gridder/ demo example seems more complete, should I be using this or the Github version?

orion3dgames commented 6 years ago

The demo has been updated a little to show you how to achieve responsiveness.. Basically, I only provide the strict minimum CSS for GRIDDER to work. If you want it to responsive, you can achieve that very easily with media queries but it is outside of the scope of GRIDDER.

mtsweir commented 6 years ago

Cheers for following this up.