Geek asks and answers

Choppy website in IE when scrolling but not in Firefox / Chrome / Safari

I'm looking for help from the team again. I created a site that, when viewed in IE, scrolls mutable, but sleek and thin in all other browsers. I checked two different laptops to make sure that it was not just my graphics card.

I also deleted all the images to see if there was a problem displaying the image, and this did not fix the problem. Does anyone have any ideas?

UPDATE *: Based on the feedback, I also tried a page with images, shadow boxes and a google font, and I still get an intermittent scroll. I also just deleted the navigation and side banner now ... until it was good.

FOUND: Well, after I essentially deconstructed my site on a css piece, I found that the reason for the intermittent screen was (mainly) the use of the border-radius attribute (thanks for pointing me in that direction). there are two div containers on my page that I applied to css as follows: -moz-border-radius: 10px; -webkit-border-radius: 10px; border-radius: 10px;

As soon as I deleted them, the page was 90% smoother. I still get some mutable scrolling due to the header image, it seems, but it is much better.

** The final solution was as follows: 1. Conditional IE was added to disable the border radius when viewing through the IE browser. 2. To remove the last bit of variability :) I took all the images that I used, created a sprite for them in Photoshop, and then used yahoo Smush-It to compress this file. The site is loading fine now.

Thanks for putting everyone in!

My url http://monopolydealrules.com

Thank!

+3
source share
3 answers

** : 1. IE IE 2. :) , , , yahoo Smush-It . .

!

UPDATE * - iphone . border-radius .

+2

I have a complicated layout, and IE9 also scrolled the scrollbar. In my case, a normal page with a full layout scrolls fine, but when you add ckeditor to the same scroll layout is very volatile. I think IE just can't display rounded corners and a complex interface at the same time.

I used this to fix this:

<!--[if lt IE 10]>
<style type="text/css">
* {
-webkit-border-radius: 0px !important; 
-khtml-border-radius: 0px !important; 
-moz-border-radius: 0px !important; 
border-radius: 0px !important; 
}
</style>
<![endif]-->
0
source

More articles:


All Articles