Question

I have the code below that works ok. It is responsible of updating social buttons on a floating bar onchange of selected value in a select tag.

$('select.select').change(function(e) {

    e.preventDefault(); 

    var value = $('select.select option:selected').val(); 
    do_social(value);
    return false;

});

function do_social(str)
{
$(".dd_inner").fadeOut("slow");
$.when(CreateNewLikeButton(str),CreateNewPlus1Button(str),CreateNewLinkedinButton(str),CreateNewSuButton(str)).done(function(){
$(".dd_inner").fadeIn("slow");
});

}

The problem is that, when the buttons are updated, the background image of the body disappears and appears again. I have many other functions that are executed at the same time as do_social(), but when I isolate them, I see that they are not responsable for this issue.

This is the style I am applying on body tag:

body {
    line-height: 1;
    background: url(images/bg.png) repeat-y; 
background-size: 100;  
 -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;


}

dd_inner is the wrapper of the social floating bar, its CSS is:

.dd_inner {
    margin: 0 auto;
    position: relative;
}

Thank you for guiding me in this issue, it is really making my website look abnormal and I am looking for solution it is been days now. I am here to provide with any additional info.

Again, thank you.

Was it helpful?

Solution

I was having another issue about the background image itself, I was looking for a way to make it keep its shape while resizing the browser window. I did:

body {

    background: url(images/bg.png) no-repeat center top fixed; 
    background-size: 100%;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
     background-size: cover;

}

The problems are resolved now. When I isolated CSS items one by one, I found that fixed resolves the reflow problem.

Thank you @Jon Jaques for your usual help.

Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top