Question

Possible Duplicate:
Issue on IE7 when page is scrolling.Text is not proper

When i am scrolling the page the search button is not proper.I have used bootstrap here.

if i am reducing the font size and making the font-weight:normal its fine else i am doing the same in twitter bootstrap document same problem is coming.

HERE IS THE test server url

http://www.onetravel.com/travel/test/ot-bootstrap/index.html

please comment if not able to reproduce in ie7 🙂 thanx in advance

Answer 1

I was unable to reproduce in IE7(IE9 with Browser and Document Mode set to 7).

Please include more info or a reproducible example and I’d be happy to help.

EDIT:

It seems that when then mouse enters the page after scrolling, it redraws the button. Based on my browsing experience, it is hard to notice. I suggest to force it to redraw the button when it becomes visible.

This small jQuery method will handle that, although further optimizations can be made. Please test it and leave a comment if it needs adjustments.

$('#my-button').RedrawWhenVisible();

$.fn.RedrawWhenVisible = function()
{

    $(window).scroll(function() {
        var docViewTop = $(window).scrollTop();
        var docViewBottom = docViewTop + $(window).height();

        var elemTop = this.offset().top;
        var elemBottom = elemTop + this.height();

        // If element is partially visible...
        if((elemBottom <= docViewBottom && elemBottom >= docViewTop) || (elemTop >= docViewTop && elemTop <= docViewBottom)) {
            //Redraw it, just once.
            if(this.attr('data-redraw')) {                
                this.hide().show();
                // Prevent further draws.
                this.removeAttr('data-redraw');
            }
        } else {
            // The element is not visible...
            if(!this.attr('data-redraw')) {
                // Flag it to redaw on scroll.
                this.attr('data-redraw','redraw');
            }
        }
    }
}

EDIT 2:

Since the other button is fine, I bet it’s a very specific CSS issue. Double check all of the attributes for those CSS classes, the grey button is fine so check how that button differs from the Orange/Yellow one.