Jump to content


Thais Baio

Member Since 21/02/2008
Offline Last Active 10/02/2015, 15:17
*----

Topics I've Started

Qndo Acaba O Conteúdo O "Scroll" Continua Rolando

11/11/2011, 15:10

qndo acaba o conteúdo o "scroll" continua rolando...como resolver isso?

aqui está meu código:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>

<style type="text/css">
#dm-box-secretarias {position:relative; width:215px; height:160px; overflow:hidden;}
        
#dm-box-secretarias .dm-conteudo-secretarias {position:absolute; height:100%; margin-top:0;}
        
#dm-box-secretarias .dm-conteudo-secretarias > ul { list-style:none; width:215px; margin-top: 10px;}

#dm-box-secretarias .dm-conteudo-secretarias > ul li{ height:30px;}

#dm-box-secretarias .dm-conteudo-secretarias > ul.dm-itens-secretarias li a{font:12px/12px Arial, Helvetica, sans-serif;color:#000; border-bottom:1px dotted #999;display:block; text-decoration:none; background:url(dm-arrow-mini-bullet.png) no-repeat left; padding-left:10px; }

.dm-bg-next {background:url(dm-arrow-down.png) no-repeat;list-style:none;position:absolute;margin-left:80px; margin-top:-20px;}

.dm-bg-prev {background:url(dm-arrow-up.png) no-repeat;list-style:none;position:absolute;margin-left:80px;margin-top:-180px;}

.dm-prev, .dm-next {color:#fff;}
        
</style>

<script type="text/javascript" src="http://code.jquery.com/jquery-1.6.4.min.js"></script>

<script type="text/javascript">

        $(document).ready(function(){           
                window.boxHeight = $(".dm-conteudo-secretarias > ul").height();
                window.boxLiHeight = $(".dm-conteudo-secretarias > ul li").height();
                window.boxQtdLi = (($(".dm-conteudo-secretarias > ul li").length));
                window.boxMaxHeight = boxLiHeight * boxQtdLi;                                   
                
                if(boxQtdLi <= 6) {
                                $('.dm-next').css('display','none');
                                $('.dm-prev').css('display','none');
                        } // pra aparecer as setinhas somente qndo tiver mais de 6 itens
                
                
                $('.dm-next').bind('click', function(){
                        var deslocamento = parseInt($('.dm-conteudo-secretarias > ul').css("margin-top")); // atribui o valor da margin-top à variavel deslocamento
                        
                        $('.dm-conteudo-secretarias > ul').animate({'margin-top' : deslocamento - 2*boxLiHeight}, "easeOutBounce", function(){
                                window.boxAnimating = false; // pra descer de 2 em 2 itens
                        });
                        
                        //if que eu nao consegui
                        if(deslocamento >= boxMaxHeight) {
                                alert("deslocamento")
                        }
                        
                        
                });
                
                $('.dm-prev').bind('click', function(){                         
                        var deslocamento = parseInt($('.dm-conteudo-secretarias > ul').css("margin-top")); // atribui o valor da margin-top à variavel deslocamento
                        
                        if(deslocamento === 10)// para parar de rolar qndo voltar tudo
                        return;
                        
                        $('.dm-conteudo-secretarias > ul').animate({'margin-top' : deslocamento + 2*boxLiHeight}, "easeOutBounce", function(){
                                window.boxAnimating = false; // para subir de 2 em 2 itens
                        }); 
                });     
                
        });
</script>

</head>

<body>

<div id="dm-box-secretarias">
        <div class="dm-conteudo-secretarias">
        <ul class="dm-itens-secretarias"> 
                <li> <a href="#"> dfsd </a> </li>
            <li> <a href="#"> fsdfs </a> </li>
            <li> <a href="#"> sdfffffff </a> </li>
            <li> <a href="#"> sdfsdfsfdf </a> </li>
            <li> <a href="#"> Osdf </a> </li>
            <li> <a href="#"> fgdfgdfgdgdfg </a> </li>
            <li> <a href="#"> dfgdfgfg </a> </li>
            <li> <a href="#"> fggdfgfdgd </a> </li>
            <li> <a href="#"> fgdgdfgdf </a> </li>
            <li> <a href="#"> dfgdgdfg </a> </li>
            <li> <a href="#"> Odfgggg </a> </li>
            <li> <a href="#"> dfgggdfgdfgdfg </a> </li>
            <li> <a href="#"> dfgdfgrred </a> </li>
        </ul>
    </div>
</div>
<ul>
    <li class="dm-bg-prev"><a href="#" title="Anteriores" class="dm-prev">Volta</a></li>
    <li class="dm-bg-next"><a href="#" title="Próximos" class="dm-next">Próximos</a></li>
</ul>

</body>
</html>

alguem sabe como resolver?

desde ja obrigado =]

Combo Box Estilo Do Site Peixe Urbano E Clickon

24/11/2010, 14:11

Olá, alguém saberia me dizer como é feito o combo box (acho que é isso) que existe no site www.peixeurbano.com.br e www.clickon.com.br no topo, onde está escrito "As melhores Ofertas em São Paulo". Aí quando clica na setinha do lado de São Paulo ou em "ver mais cidades" aparece tipo um submenu.

Alguém sabe como isso é feito? Dá pra fazer só com div?? Alguém pode me ensinar a fazer??

Desde já obrigado!!!

=]

ninguem sabe????

IPB Skin By Virteq