tag:support.berta.me,2012-03-15:/discussions/questions/29932-background-gallery-buffering-graphicberta.me: Discussion 2014-09-25T08:17:19Ztag:support.berta.me,2012-03-15:Comment/346869052014-09-23T13:17:43Z2014-09-23T13:17:43ZBackground gallery 'Buffering' graphic<div><p>Hello, Paul,<br>
yes, it's possible.<br>
under "template design - custom CSS" add this CSS
definition:<br></p>
<pre>
<code>div.xGalleryContainer .loader {
background: url('http://ajaxload.info/cache/FF/FF/FF/00/00/00/39-0.gif') no-repeat center center;
width: 24px;
height: 24px;
}</code>
</pre>
<p>you can change the image you wish.</p>
<p>Good luck</p></div>Uldistag:support.berta.me,2012-03-15:Comment/346869052014-09-23T17:23:45Z2014-09-23T17:23:45ZBackground gallery 'Buffering' graphic<div><p>Hi Uldis,</p>
<p>I tried your advice but with no result. I used ajaxload to
generate a loading gif, then saved this gif, uploaded it to image
host site, and pasted the image url in place of the previous image.
I pasted the code in the CSS box, no other code is in there. Do you
know what I've done wrong?</p>
<p>Also, is there a way to change the 'menu' image in
responsive?</p>
<p>thanks,</p>
<p>Paul</p></div>Paul Whitetag:support.berta.me,2012-03-15:Comment/346869052014-09-24T07:58:20Z2014-09-24T07:58:20ZBackground gallery 'Buffering' graphic<div><p>I can see, that it's working for slideshow gallery type, see
attached screenshot. Maybe you mean a full screen gallery loading
image? In this case use this custom CSS code:<br></p>
<pre>
<code>.mbLoading{
background: rgba(255,255,255,0.8) url('http://example.com/sample.gif') no-repeat center;
}</code>
</pre>
<p>Keep in touch</p></div>Uldistag:support.berta.me,2012-03-15:Comment/346869052014-09-24T08:03:07Z2014-09-24T08:03:33ZBackground gallery 'Buffering' graphic<div><p>Here is the sample code for custom responsive menu toggle
button:<br></p>
<pre>
<code>#menuToggle {
background: url('http://s28.postimg.org/4c0z2h9uh/34_1.gif') no-repeat center center;
border: none;
}
#menuToggle span, #menuToggle span:before, #menuToggle span:after {
display: none;
}</code>
</pre>
<p>you can customise this code as you wish</p>
<p>Have a nice day</p></div>Uldis