the box-shadow ‘follows’ the Jquery Slide Down effect


I made this tiny video (please ignore if background noises)

its 13 seconds but only need to see the animation going on in second 5; (or go and wait few seconds untill you can se the same box and click)

The css -the item has both clases-

.keepeos .top {
border-radius: 0.2em 0.2em 0.2em 0.2em;
color: #000066;
font-size: 40px;
height: 120%;
padding-bottom: 3px;
padding-top: 3px;
position: relative;
right: 10%;
top: -4px;
width: 120%;

.caja_con_sombra {
box-shadow: 0 0 4px rgba(0, 0, 0, 0.9);

And the javascript (posted the full script but commented on the only, in my opinion, relevant line.

<script type="text/javascript">

var variable;
function check_more(id){

var nID=$(".item_lista_links:first").attr("id"); //get the newest item's id
var tid= nID.replace('link', '');
$('#are_more').load('/includes/router.php?que=check_more&last='+tid+''); // check if newer
function buscar_nuevos(){
var nID=$(".item_lista_links:first").attr("id");
var id= nID.replace('link', '');
variable = setInterval('check_more('+id+')',15000); //start checking
function ver_nuevos(id){ // when found news and retrieving
$('#are_more').html(''); //clear div

/*THIS is basically the only relevant javascript line, i think */

function() {

variable = setInterval("check_more(139125)",15000);
$(this).slideDown(600); //start checking
return false;

So how can i prevent this shadow to expand the whole vertical animation?

Problem courtesy of: Toni Michel Caubet


I’m still not exactly sure what’s going on, but I know how to fix it (at least for now). It might be due to the element sliding in mixed with a height issue in jquery for elements that are children in the sliding element, but I’m not sure. Either way:

Knowing that, here is a fix. In estilo.css , find

.keepeos {
height: auto;

Change that to:

.keepeos {
height: 18px;

This will work against you if that ever becomes multi-lined, so if you need to in the future, maybe you can switch the tag while sliding and then switch it back when it’s done.

Solution courtesy of: craniumonempty

View additional discussion.