Jump to content


Photo
SuperFade

Background Too Stretched



Best Answer cmunns , 02 April 2013 - 10:18 PM

I'm not sure if this way of writing the script is correct, because what you've done is call the jQuery document ready function twice.

 

 

 

 
(function($){
// code here
)(jQuery);
 

 

Is the same thing as 

 

 

 

 
$(document).ready(function(){    
// code here          
});
 

 

If it works for you then that's great, I just wanted to bring it to your attention in case something gets wonky.

Go to the full post


This topic has been archived. This means that you cannot reply to this topic.
8 replies to this topic

#1 tsalstrand†

tsalstrand

    Advocate

  • DMS Subscriber†
  • 255 posts

Posted 28 March 2013 - 05:35 PM

First off, as I mentioned on the product page... thanks a lot for bringing this to Pagelines Framework!

 

The site that I'm currently working to integrate Superfade into is http://patdev.us

 

When I look at http://srobbin.com/j...s/backstretch/, the background images aren't stretched and are fixed when scrolling.  I'm basically trying to do the same.

 

I'm not good with js, but I know that the resizing issue probably comes from resize()

 

Could you help me in fixing this issue?  I tried resizing my images to 1200x800 that is on Scott Robbins' website... but it still stretches them.

 

Thanks in advance!
Steve



#2 cmunns

cmunns

    Advocate

  • Members

  • 6537 posts

Posted 28 March 2013 - 07:09 PM

You can apply the fixed position yourself using some css. Use the important tag to override the default inline style.

 

 

 

 
.backstretch {position:fixed!important;} 
 


#3 tsalstrand†

tsalstrand

    Advocate

  • DMS Subscriber†
  • 255 posts

Posted 01 April 2013 - 08:03 PM

Thanks a bunch!



#4 tsalstrand†

tsalstrand

    Advocate

  • DMS Subscriber†
  • 255 posts

Posted 01 April 2013 - 09:01 PM

So I spoke a little too soon.  The 

 
.backstretch {position:fixed!important;
} 

 

worked good for fixing the background attachment, but the images are still stretching.  How do I stop them from stretching?



#5 tsalstrand†

tsalstrand

    Advocate

  • DMS Subscriber†
  • 255 posts

Posted 02 April 2013 - 02:24 PM

Hi Adam,

 

I just wanted to see if you have any ideas... we really want to use this.

 

Thanks in advance!



#6 cmunns

cmunns

    Advocate

  • Members

  • 6537 posts

Posted 02 April 2013 - 03:51 PM

The point of this plugin is actually to provide image stretching so I'm confused at this point what you are requesting. If you are experiencing aliasing or blur, then I would suggest using a higher res photo to avoid that.



#7 tsalstrand†

tsalstrand

    Advocate

  • DMS Subscriber†
  • 255 posts

Posted 02 April 2013 - 07:48 PM

We are using high-res images (approx. 1800x1200)... still it is causing the background to be blurred/pixelated.

 

If anyone else is having the same problem, I want to provide the solution that we found: 

 
<script>
  
(function($){
  $(document).ready(function()
              {
    $.backstretch([
           "http://patdev.us/wp-content/uploads/2013/03/pat-bg1.jpg",
          "http://patdev.us/wp-content/uploads/2013/03/pat-bg33.jpg"
        ], {
            fade:700,
            duration: 4500
        });    
          
          });
})(jQuery);
            
</script>

 

Cheers!



#8 cmunns

cmunns

    Advocate

  • Members

  • 6537 posts

Posted 02 April 2013 - 10:18 PM   Best Answer

I'm not sure if this way of writing the script is correct, because what you've done is call the jQuery document ready function twice.

 

 

 

 
(function($){
// code here
)(jQuery);
 

 

Is the same thing as 

 

 

 

 
$(document).ready(function(){    
// code here          
});
 

 

If it works for you then that's great, I just wanted to bring it to your attention in case something gets wonky.



#9 tsalstrand†

tsalstrand

    Advocate

  • DMS Subscriber†
  • 255 posts

Posted 03 April 2013 - 02:23 PM

Thanks Adam!  As I said in the original post... I'm not that great at jQuery, js, etc.  So thanks for the correction! :thumbsu: