Ir para conteúdo

Arquivado

Este tópico foi arquivado e está fechado para novas respostas.

marcelocardoso

overflow que não ocorre com JQuery

Recommended Posts

Galera...

Estou usando o JQ para centralizar ao centro, centraliza td e tal, porém, ao redimensionar a tela em COL-MD-XS, o scroll não ocorre, o conteúdo acima, CORTA.

Se alguem quiser contribuir, segue código para adaptar...
Tentei atribuir no CSS, overflow: auto, mas mesmo assim, no body, n vai....

<script type="text/javascript">
        (function($){
            $(document).ready(function(){
                $.fn.center=function(){
                    return this.each(function(){
                        var $this=$(this),
                            parent=$this.parent(),
                            topPos,
                            topMargin,
                            leftMargin,
                            resizeTimeout;
                        if(parent.is("body:not(.root-height-set)")){
                            $("html,body").css("height","100%").addClass("root-height-set");
                        }
                        if($this.css("position")==="absolute" || $this.css("position")==="fixed"){
                            topPos="50%";
                            topMargin="-"+Math.round($this.outerHeight()/2)+"px";
                            leftMargin="-"+Math.round($this.outerWidth()/2)+"px";
                            $this.css({"left":"50%","margin-left":leftMargin});
                        }else{
                            topPos=Math.floor((parent.height()-$this.outerHeight())/2);
                            topMargin="auto";
                            $this.css({"position":"relative","margin-left":"auto","margin-right":"auto"});
                        }
                        $this.css({"top":topPos,"margin-top":topMargin});
                        $(window).resize(function(){
                            if(resizeTimeout){
                                clearTimeout(resizeTimeout);
                            }
                            resizeTimeout=setTimeout(function(){
                                if($this.css("position")==="absolute"){
                                    topMargin="-"+Math.round($this.outerHeight()/2)+"px";
                                    leftMargin="-"+Math.round($this.outerWidth()/2)+"px";
                                    $this.css({"margin-left":leftMargin,"margin-top":topMargin});
                                }else{
                                    topPos=Math.floor((parent.height()-$this.outerHeight())/2);
                                    $this.css("top",topPos);
                                }
                            },150);
                        });
                    });
                }
                $("#box").center();
            });
        })(jQuery);
    </script>

Centralizar, centraliza, porém, overflow, em dispositivos mobile, NOT - não.
obrigado.

Compartilhar este post


Link para o post
Compartilhar em outros sites

pessoal, n entendo muito de jquery, portanto, como posso adaptar para que este código, utilizada da net, faça overflow, pois n está ocorrendo, ele faz oq promete, centraliza em qualquer resolução, portanto, come parte do topo do conteudo acima.

tentei aqui, inserir, OVERFLOW: auto;

$this.css({"left":"50%","margin-left":leftMargin});

assim: 

$this.css({"left":"50%",overflow":"auto","margin-left":leftMargin});

mas n tive sucesso,
desde já agradeço contribuições.
obrigado.

Compartilhar este post


Link para o post
Compartilhar em outros sites

×

Informação importante

Ao usar o fórum, você concorda com nossos Termos e condições.