0

if i open my testsite: http://devauth.labscope.de/htmlapp/report-overview_test.html

and click on the top left icon (filter) so the content and footer slide left and i see that the footer container don't have the same width as content container because the scrollbar in the Content make this.

enter image description here

How can i solve this in my Code?:

jQuery('.filter').on("click", function(e){
        e.preventDefault();

        var state   = $(this).data('state'),
            wrapper = $('#content').data('left'),
            footer  = $('#footer').data('left');

        jQuery("#content").animate({
            left: state ? wrapper : -250,
            duration: 1000
        }, "normal");

        jQuery("#footer").animate({
            left: state ? footer : -250,
            duration: 1000
        }, "normal");

        jQuery(this).data('state', !state);


    });

I hope someone have idea.

Dave-88
  • 217
  • 2
  • 5
  • 17

1 Answers1

1

Try this:

$(document).ready(function() {
    $('#footer').width($('#content').width());
});
Latheesan
  • 23,247
  • 32
  • 107
  • 201
  • It's works but if i slide back and make my browser width wider and i have a problem. So i need before state. How can i solve this ? – Dave-88 Oct 16 '13 at 13:53
  • Why don't you attach to the window resize event and set the width? e.g. `$(window).resize(function() { $('#footer').width($('#content').width()); });` – Latheesan Oct 16 '13 at 14:01
  • No. i use this only in my slide function – Dave-88 Oct 16 '13 at 14:12
  • You should be able to add this one line into your slide function to have the footer update as you slide `$('#footer').width($('#content').width());` – Latheesan Oct 16 '13 at 14:25
  • jQuery(window).resize(function() { jQuery('#footer').css('width', '100%'); }); – Dave-88 Oct 16 '13 at 14:28