Recent
Categories
View Replies (4)

Background module position Sophia template

0
Votes
Undo
  1. Mol4
    Mol4
  2. Sherlock Holmes The Voice
  3. Commercial Templates
  4. Wednesday, 04 July 2018
  5.  Subscribe via email
Hello Ciarán,
On my clients test website I'm using the Sophia template.
For the homepage there is a text (Onze Visie) in modulepostion top-2a.
In the 'Module Style Override' of the template I've choosen a background image for this position.
Because I want this background image fixed I've added the following css to the custom.css file:
.top-2a .module_surround {
background-attachment: fixed!important;
}
Now this is working well in Firefox but in Chrome there is no background at all (only visible when I zoom the page out as far as I can go) and in IE the background 'hops arround' while scrolling down the page.
Can you think off a way how to fix this?
Thanks!
Greetings Ton
Responses (4)
ciaran
ciaran
Love Fool Sherlock Holmes The Voice
Notable Answerer Notable Answerer
Accepted Answer Pending Moderation
0
Votes
Undo
Hi Ton

To amend you can add the following to the Custom CSS field of your templates parameters (Extensions -> Templates -> [YourTemplateStyle] -> Custom CSS)....

.top-2a .module_surround {

    background-attachment: fixed!important;

    -webkit-backface-visibility: hidden;

}


Ciaran
  1. more than a month ago
  2. Commercial Templates
  3. # 1
Mol4
Mol4
Sherlock Holmes The Voice
Accepted Answer Pending Moderation
0
Votes
Undo
Hello Ciarán,

Thanks!
This solves the issue in Chrome.
But unfortunately in IE the image still 'hops arround' wehn scrolling the page.
Thanks,
Ton
  1. more than a month ago
  2. Commercial Templates
  3. # 2
ciaran
ciaran
Love Fool Sherlock Holmes The Voice
Notable Answerer Notable Answerer
Accepted Answer Pending Moderation
0
Votes
Undo
Hi Ton

Unfortunately we are unable to replicate your issue using IE. Are you having similar issues with IE on other websites with fixed backgrounds?

Ciaran
  1. more than a month ago
  2. Commercial Templates
  3. # 3
Mol4
Mol4
Sherlock Holmes The Voice
Accepted Answer Pending Moderation
0
Votes
Undo
Hello Ciarán,
I didn't pay attention to other sites with backgrounds fixed because I never use IE (11) :)
But I managed to get the background image not to move with a script I found regarding this issue (there are many and not all work :( )
<script>
jQuery( function() {
if(navigator.userAgent.match(/Trident\/7\./)) { // if IE
jQuery('body').on('mousewheel', function () {
// remove default behavior
event.preventDefault();
//scroll without smoothing
var wheelDelta = event.wheelDelta;
var currentScrollPosition = window.pageYOffset;
window.scrollTo(0, currentScrollPosition - wheelDelta);
});
}
});
</script>
Only thing is that the whole page is not going smooth when scrolling, but maybe this is the best solution for IE.
Thanks!
  1. more than a month ago
  2. Commercial Templates
  3. # 4
  • Page :
  • 1


There are no replies made for this post yet.
Be one of the first to reply to this post!