Monthly Archives: mai 2010
jQuery and scrollTop, how can this work for IE/Chrome/Safari and Firefox ?
Today I have to make a scrollTop for a webpage, and I use jQuery for the most part of the javascript in the website.
So, the problem is, I do $(‘body’).scrollTop(0); and this work for Safari/Chrome, but only for it. So, I looking for a solution in the Internet, and it’s a pain to find one for all. But finally I found one, やった (yatta)!
What is it ? Simply $(« html,body »).animate({scrollTop: 0},0); and it’s work.
CSS a nice popup with a border radius and opacity
Today I try to do a simple and nice popup in CSS without image.
So what I really want to do ?
Simple no ? Unfortunatly not.
One, you need to do the border opacity. For that one thing : If you have an opacity in one element, all its child have the same opacity (an opacity of 1 in the child is the opacity of the parent, an opacity of 0.5 in the child is 0.5*opacity of the parents).
So, I do that with 2 div in the same parents :
<div id= »parents »>
<div id= »child_border »>
</div>
<div id= »child_content »>
</div>
</div>
After that, I fix the opacity of child_border at 0.5 and I put it in center of the screen and x pixel from top. For the child_content I add 10px margin, so in reality I add the same margin-left than child_border plus 10px and I remove 20px from the width. And for the top, just add 10px to top.
So with thatm you have the basse. You have just to add the border radius : for webkit : -webkit-border-radius:10px; For Firefox : -moz-border-radius:10px; And for IE … Nothing for the moment. But you can add the standard border-radius:10px;
For IE opacity is not the same than webkit based browser (Safari/Chrome for example) or Gecko based (Firefox for example), it’s filter:alpha(opacity=50) for an opacity of 0.5.
