# Visual\_effect + ajax star rating system = display problem in IE 7.0

**URL:** <https://www.ruby-forum.com/t/visual-effect-ajax-star-rating-system-display-problem-in-ie-7-0/144752>\
**Category:** Rails\
**Created:** [August 1, 2008, 7:38pm UTC](https://www.ruby-forum.com/t/visual-effect-ajax-star-rating-system-display-problem-in-ie-7-0/144752 "2008-08-01T19:38:43Z")\
**Posts on this page:** 1\
**Page:** 1

<div class="post-metadata">

**Author:** ![LAB](https://www.ruby-forum.com/letter_avatar_proxy/v4/letter/l/ba8739/32.png) [@LAB](https://www.ruby-forum.com/u/LAB)\
**Post date:** [August 1, 2008, 7:38pm UTC](https://www.ruby-forum.com/t/visual-effect-ajax-star-rating-system-display-problem-in-ie-7-0/144752/1 "2008-08-01T19:38:43Z")

</div>

Hi everyone!

I have implemented the Ajax CSS Star Rating with acts\_as\_rateable as  
seen here:  
[http://blog.aisleten.com/2007/05/03/ajax-css-star-rating-with-acts\_as\_rateable/](http://blog.aisleten.com/2007/05/03/ajax-css-star-rating-with-acts_as_rateable/)

I have the star ratings hidden in a div, so that when the user clicks  
on a link, a toggle\_blind visual\_effect is called, and the div  
appears, like so:

View code:  
\<%= link\_to “rate!”, “#”, :onclick =\> visual\_effect(:toggle\_blind,  
‘review’) %\>  
…

... \<%= render :partial =\> "ratings/rate", :locals =\> { :asset =\> @user } %\> ...

This works great in Firefox and Safari, but in IE 7.0, when the  
visual\_effect is clicked on, it shows everything in the div EXCEPT the  
star ratings (graphics defined in the CSS). Really strange thing is,  
if I have another tab open in IE 7.0, and switch to that tab, then  
come back to my page, the star ratings have now appeared! If I remove  
the line of html to make the div hidden at first  
“style=‘display:none’”, the star ratings appear perfectly on the  
page. If I toggle the div after the page is loaded this time, I again  
loose the star ratings graphics after the toggle.

So it seems the problem is in how IE 7.0 is handling this  
visual\_effect? And it is only affecting the star graphics in the CSS.

Anyone else run into this or have any thoughts on things I can try to  
make it work like Firefox and Safari? Basically, I want the div  
hidden to begin with, onclick the visual\_effect toggles the div, and  
the star ratings should appear with this onclick action.

Thanks in advance!  
LAB
