Page 1 of 1
Masonry Effect without hardcoded styles
Posted: 28 Oct 2013, 13:37
by jackprince
Hello Jan & Community,
I try to use the masonry effect in a gallery. But I miss the option to style the view myself. Unfortunately PG adds hard coded styles directly to the elements.
pg-msnr-container gets
Code: Select all
position: relative; height: 230px; width: 600px;
and child elements
Code: Select all
position: absolute; top: 0px; left: 0px;
Also I'm not able to find the code which injects "pg-csv-box" style definitions into the body of the document.
I just would like to have an output with different height mosaic/masonry effect without hard coded styles.
I'll appreciate any help to accomplish that.
greetings,
Daniel
Re: Masonry Effect without hardcoded styles
Posted: 29 Oct 2013, 20:04
by Jan
Hi, it is not hardcoded as default, Phoca Gallery does'n set the size for masonry
The only one hardcoded style (css) is following:
Code: Select all
#pg-msnr-container {
padding: 0;
margin: 0;
}
or in php gets: margin: 0 auto, in case it is centered.
Masonry effect set the sizes automatically.
Jan
Re: Masonry Effect without hardcoded styles
Posted: 30 Oct 2013, 11:01
by jackprince
As far as I can see it there are added 'styles' to the element itself in the markup.
Maybe via the javascript file?
I will write a longer post later on to display the problem. Maybe it's a mix of different configurations which trigger this effect.
Re: Masonry Effect without hardcoded styles
Posted: 30 Oct 2013, 11:34
by Jan
Ok
Re: Masonry Effect without hardcoded styles
Posted: 15 Nov 2013, 14:06
by jackprince
Sorry for the late response.
Here is a snippet of the markup I was talking about.
Code: Select all
<div class="pg-cv-box item col-lg-4 masonry-brick" style="position: absolute; top: 0px; left: 100px;">
<div class="img-thumbnail pg-cv-box-img pg-box1">
<div class="pg-box2">
<div class="pg-box3">
<a><img /></a>
</div>
</div>
<div class="ph-cb"></div>
</div>
As you may see, I already did some template override (added col-lg-4 and img-thumbnail, both classes from bootstrap3).
The style attribute and the class 'masonry-brick' are added via JS as far as I know. Is there a way to get the masonry effect without the hardcoded styling?
Re: Masonry Effect without hardcoded styles
Posted: 15 Nov 2013, 14:30
by jackprince
I currently try to get the effect with pure css. With some css and a fallback.
Re: Masonry Effect without hardcoded styles
Posted: 18 Nov 2013, 22:12
by Jan
Hi, what you mean with: get the masonry effect without the hardcoded styling"? there is nothing hardcoded, the masonry is added by javascript
Jan
Re: Masonry Effect without hardcoded styles
Posted: 27 Nov 2013, 09:44
by jackprince
Is it possible to change this from adding styles to the elements , to change/add classes?
I ran into some issues while styling caused by above shown style attribute.
Re: Masonry Effect without hardcoded styles
Posted: 27 Nov 2013, 22:45
by Jan
Hi, I think, this you should ask the Masonry developer.
Jan