-
1. Re: How to make existing Photo gallery module responsive?
Liam Dilley Jul 23, 2014 3:27 AM (in response to martinb1977)If you use some of the concepts here:
http://www.prettypollution.com.au/pretty-codes/responsive-tables-in-bc
It is relatively straight forward
-
2. Re: How to make existing Photo gallery module responsive?
martinb1977 Jul 23, 2014 3:33 AM (in response to Liam Dilley)Thx Liam, but I am not sure how to use that code for the photo gallery module.
Is there a tutorial that shows what to do? Is there a website example that has this code for responsive photo gallery?
-
3. Re: How to make existing Photo gallery module responsive?
Liam Dilley Jul 23, 2014 5:27 AM (in response to martinb1977)No,
This is just basics of CSS and media query stuff. That is really the barebones bits you need. The photo gallery renders as tables so making things block level elements, floating etc will allow them to be fluid.Then for images you can google "making an image responsive" and you have heaps of examples.
-
4. Re: How to make existing Photo gallery module responsive?
TheBCMan Jul 30, 2014 7:28 PM (in response to martinb1977)Render the BC photo gallery into a hidden div, use it a data reference, write your own ways to display the data as liquid as you need it using the data from the table. The good thing about BC render is it is predictable therefore you can code your JS around that to display anyway you need.
I have a feeling when the modules are re-written as BC apps in the future (no idea when) they should be more modern coded and liquidable, but for now that it how I would do a liquid photo gallery.
-
5. Re: How to make existing Photo gallery module responsive?
Liam Dilley Jul 31, 2014 1:09 AM (in response to TheBCMan)Non Javascript method is the best option here in my view.
-
6. Re: How to make existing Photo gallery module responsive?
TheBCMan Jul 31, 2014 9:03 PM (in response to Liam Dilley)Liam: How would you go about that in CSS without javascript?
-
7. Re: How to make existing Photo gallery module responsive?
Liam Dilley Aug 1, 2014 6:58 PM (in response to TheBCMan)The link I put above maybe?
CSS - Every element has a default display type but every element can have its block level changed.
A span is an inline element but you can turn it into a block level element. A table element is a table or table cell display type but you can turn it into block level. This is all CSS2/1 stuff so cross browser compatible (but if your doing media queries and responsive the old browsers are not considered anyway) and very straight forward.
-
8. Re: How to make existing Photo gallery module responsive?
TheBCMan Aug 3, 2014 6:23 PM (in response to Liam Dilley)While I respect your answer to the question, these are still tables
In short here you're applying a percentage to the width to make them "responsive", ala HTML3 / 2001 style, while there is nothing wrong with that I assumed the person asking the question wanted a complete DIV based responsive system. If a percentage table is a correct answer then your answer is obvious and correct.
-
9. Re: How to make existing Photo gallery module responsive?
Liam Dilley Aug 3, 2014 7:30 PM (in response to TheBCMan)Actually, no, like I said, more to it then that.
With then being block level elements there is NO difference to the div based solution.
In terms of markup, the rendered markup, even with a javascript solution will still be tables because the scripting is happening in the dom.
So with the pure CSS solution you have better performance and there is no need for the scripting unless your doing extra modifications to its functionality.
-
10. Re: How to make existing Photo gallery module responsive?
TheBCMan Aug 3, 2014 7:45 PM (in response to Liam Dilley)Not disagreeing with you, if you want to re-jig a table in CSS like that, it's a solution to make it stretchable / responsive.



