Imprimindo áreas isoladas de uma página com jQuery

Nesse tutorial vamos ver como fazer a impressão de áreas isoladas de uma página web. Com esse plugin você não precisará enviar o usuário para outra página, bastará informar qual parte da página deve ser impressa...

Por | @jonathanlamimkt Programação

Antes de iniciarmos, faça o download do plugin clicando no link abaixo.

http://plugins.jquery.com/files/jquery.PrintArea.js_4.txt

Agora que você já fez o download, chegou a hora de ver como utilizá-lo.

Na sua página você terá uma estrutura de conteúdo, formatado por < p >, etc. Em alguma parte da sua página você terá um botão do tipo IMPRIMIR, que fará a impressão da página toda ou irá enviar o usuário para uma outra página, onde tenha somente o conteúdo que deve ser impresso.

Com esse plugin você não precisará enviar o usuário para outra página, bastará informar qual parte da página deve ser impressa, e além do mais, você poderá permitir ao usuário que imprima as áreas da página de forma independente, bastando informar qual a área deve ser impressa.

No exemplo abaixo temos um codigo simples, que demonstra a impressão de um bloco de texto.




   Imprimindo áreas isoladas de uma página com jQuery</title>
   <script language="javascript" src="jquery.js"></script>
   <script type="javascript">
      $(document).ready(function(){
         $('.print').click(function(){
            $('.contentPrint').printArea();
            return false;
         });
      });
   </script>
</head>
<body>
<p><a onclick="_gaq.push(['_trackEvent', 'link_externo', 'de_post-POSTURI', 'para_url_#']);"   href="https://www.oficinadanet.com.br/redirect.php?tipo=postout&urlout=%23" rel="nofollow"  class="print">Clique aqui</a> para <a onclick="_gaq.push(['_trackEvent', 'link_tag', 'pfr2225', 'tagto_imprimir']);" href='https://www.oficinadanet.com.br/imprimir'>imprimir</a> o texto abaixo.</p>
<div class="contentPrint">
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas non turpis tortor, 
et aliquam urna. Nulla facilisi. Donec eleifend, felis vitae tristique auctor, ante urna 
tempor dolor, sit amet tincidunt eros nunc eu nibh. Nunc et lectus id nunc faucibus blandit 
ac ac ipsum.</p>
<p>Mauris pretium, orci et sagittis sodales, ipsum quam vestibulum justo, ut ullamcorper 
mauris ipsum eu lacus. Etiam at purus tellus, sit amet rutrum nunc. Ut facilisis urna 
vitae tortor semper ullamcorper faucibus mi varius. </p>
<p>Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos 
himenaeos. Morbi sit amet sodales odio. In in lacus id augue posuere tincidunt in id 
justo.</p>
</div>
</body>
</html>
</code></pre><br />
<br />
No bloco <script></script> inserido na página, simplesmente adicionamos ao evento click do link "Clique aqui", a informação de que ele deverá imprimir o conteúdo que estiver dentro do elemento especificado com a classe "contentPrint", e retornamos false para que o href do link não interfira na ação, levando o usuário para o topo da página.<br />
<br />
Alguns parâmetros podem ser passados para a função, possibilitando uma melhor formatação do posicionamento da tela de impressão que será aberta.<br />
@mode | [string]  | (iframe),"popup"     | printable window is either iframe or browser popup<br />
<br />
@popHt | [number]  | (500)                  | altura da janela<br />
<br />
@popWd | [number]  | (400)                  | largura da janela<br />
<br />
@popX | [number]  | (500)                  | posição X da janela<br />
<br />
@popY | [number]  | (500)                  | posição Y da janela<br />
<br />
@popTitle | [string]  | (?)                   | titulo da janela<br />
<br />
@popClose | [boolean] | (false),true           | fechar a janela após a impressão<br />
<br />
Esses parâmetros são passados da seguinte forma:<br />
<pre><code>
<script type="javascript">
$(document).ready(function(){
   $('.print').click(function(){
      $('.contentPrint').printArea({
         mode:'popup',
         popHt: 500,
         popWt: 400,
         popX: 500,
         popY: 500,
         popTitle: 'Título da janela'
      });
      return false;
   });
});
</script></code></pre><br />
Com o uso desse plugin, criar impressão de elementos de uma página se torna uma tarefa bem simples.<br />
<br />
Em caso de dúvidas ou sugestões, deixem os seus comentários que eles serão respondidos o mais breve possível.</p></p><script src="https://painel.m3midia.com.br/lib/prism/prism.js"></script><link rel="stylesheet" type="text/css" href="https://painel.m3midia.com.br/lib/prism/prism.css"></p>
                    </div><script type="text/javascript">try { _402_Show(); } catch(e) {}</script>
                    <div class="wifl">
                        Mais sobre: <a onclick="_gaq.push(['_trackEvent', 'assuntosfim', 'pfr2225', 'para_javascript']);"  href="https://www.oficinadanet.com.br/javascript" >javascript</a>, <a onclick="_gaq.push(['_trackEvent', 'assuntosfim', 'pfr2225', 'para_jquery']);"  href="https://www.oficinadanet.com.br/jquery" >jquery</a>, <a onclick="_gaq.push(['_trackEvent', 'assuntosfim', 'pfr2225', 'para_imprimir']);"  href="https://www.oficinadanet.com.br/imprimir" >imprimir</a>
                        <div style="float:right">
                            <span class="bt1-facebook bg9"  onclick="  window.open('https://www.facebook.com/sharer/sharer.php?app_id=209309632417494&u=https%3A%2F%2Fwww.oficinadanet.com.br%2Fartigo%2Fjavascript%2Fimprimindo_areas_isoladas_de_uma_pagina_com_jquery','','width=600,height=400');  ajaxDireto('https://www.oficinadanet.com.br/ajax_oficina.php','act=flgcomment&id=2225','flgcomment');  "  >Share</span>
                            <span class="bt1-twitter bg8"  onclick="  window.open('https://twitter.com/intent/tweet?text=Imprimindo+%C3%A1reas+isoladas+de+uma+p%C3%A1gina+com+jQuery&url=https%3A%2F%2Fwww.oficinadanet.com.br%2Fartigo%2Fjavascript%2Fimprimindo_areas_isoladas_de_uma_pagina_com_jquery&via=oficinadanet','','width=600,height=400');  ajaxDireto('https://www.oficinadanet.com.br/ajax_oficina.php','act=flgcomment&twitter=1&id=2225','flgcomment');  "  >Tweet</span>
                            <span class="bt1-telegram bg25"  onclick="  window.open('https://telegram.me/share/url?url=https%3A%2F%2Fwww.oficinadanet.com.br%2Fartigo%2Fjavascript%2Fimprimindo_areas_isoladas_de_uma_pagina_com_jquery&text=Imprimindo+%C3%A1reas+isoladas+de+uma+p%C3%A1gina+com+jQuery');  ajaxDireto('https://www.oficinadanet.com.br/ajax_oficina.php','act=flgcomment&id=2225','flgcomment');  "  ></span>
                            <span class="bt1-flipboard bg26"  onclick="  window.open('https://share.flipboard.com/bookmarklet/popout?v=2&url=https%3A%2F%2Fwww.oficinadanet.com.br%2Fartigo%2Fjavascript%2Fimprimindo_areas_isoladas_de_uma_pagina_com_jquery&title=Imprimindo+%C3%A1reas+isoladas+de+uma+p%C3%A1gina+com+jQuery','','width=600,height=400');  ajaxDireto('https://www.oficinadanet.com.br/ajax_oficina.php','act=flgcomment&id=2225','flgcomment');  "  ></span>
                        </div>
                    </div>
                </div>
            </div>  
        <div class="bar2 p-rel" id="out_post_barra" data-distance="30" >
            <div class="bar2" id="post_barra" ><span class="titulo1" ><span>DESTAQUES</span></span><ul class="lst12 m-b-40 wifl  lsn "  id=""  ><li  >
                            <a class="" href="https://www.oficinadanet.com.br/zenfone4/19954-asus-apresenta-o-zenfone-4-e-zenfone-4-pro"  onclick="_gaq.push(['_trackEvent', 'barra_destaques', 'pfr2225', 'pto19954']);"    >
                                <span class="img box-img" >
                                    <img src="https://www.oficinadanet.com.br/imagens/post/19954/zenfone4-capa_14080.jpg" title="ASUS apresenta o Zenfone 4 e Zenfone 4 PRO" alt="ASUS apresenta o Zenfone 4 e Zenfone 4 PRO" >
                                </span>
                                <div class="info" >
                                    <span class="tit" >zenfone4</span>
                                    <h3 class="tit tit2" >ASUS apresenta o Zenfone 4 e Zenfone 4 PRO</h3>
                                </div>
                            </a>
                        </li><li  >
                            <a class="" href="https://www.oficinadanet.com.br/post/14915-como-instalar-o-windows-10-com-a-iso"  onclick="_gaq.push(['_trackEvent', 'barra_destaques', 'pfr2225', 'pto14915']);"    >
                                <span class="img box-img" >
                                    <img src="https://www.oficinadanet.com.br/imagens/post/14915/logo_14080.jpg" title="Como formatar o PC e instalar o Windows 10 com a ISO em pendrive" alt="Como formatar o PC e instalar o Windows 10 com a ISO em pendrive" >
                                </span>
                                <div class="info" >
                                    <span class="tit" >Windows10</span>
                                    <h3 class="tit tit2" >Como formatar o PC e instalar o Windows 10 com a ISO em pendrive</h3>
                                </div>
                            </a>
                        </li><li  >
                            <a class="" href="https://www.oficinadanet.com.br/tecnologia/19933-como-funciona-o-acesso-a-censura-na-internet-da-china"  onclick="_gaq.push(['_trackEvent', 'barra_destaques', 'pfr2225', 'pto19933']);"    >
                                <span class="img box-img" >
                                    <img src="https://www.oficinadanet.com.br/imagens/post/19933/capa_14080.jpg" title="Como funciona a censura e o acesso à internet da China" alt="Como funciona a censura e o acesso à internet da China" >
                                </span>
                                <div class="info" >
                                    <span class="tit" >censura</span>
                                    <h3 class="tit tit2" >Como funciona a censura e o acesso à internet da China</h3>
                                </div>
                            </a>
                        </li></ul><span class="titulo1 m-t-10" ><span>Mais compartilhados</span></span><div class="wifl m-b-20"><ul class="lst12  wifl  lsn "  id=""  ><li  >
                            <a class="" href="https://www.oficinadanet.com.br/tecnologia/19886-policia-federal-precisa-criar-software-para-lidar-com-mais-de-1-milhao-de-gb-da-lava-jato"  onclick="_gaq.push(['_trackEvent', 'complatilhados_barra', 'pfr', 'pto66750']);"    >
                                <span class="img box-img" >
                                    <img src="https://www.oficinadanet.com.br/imagens/post/19886/capa_14080.jpg" title="Polícia Federal precisa criar software para lidar com mais de 1 milhão de GB da Lava Jato" alt="Polícia Federal precisa criar software para lidar com mais de 1 milhão de GB da Lava Jato" >
                                        <div class="share">
                                            <span class="bt5 bt5-share"></span>
                                            <p>311</p>
                                        </div>
                                        <span class="gradient3"></span>
                                </span>
                                <div class="info" >
                                    <span class="tit" ></span>
                                    <h3 class="tit tit2" >Polícia Federal precisa criar software para lidar com mais de 1 milhão...</h3>
                                </div>
                            </a>
                        </li><li  >
                            <a class="" href="https://www.oficinadanet.com.br/perifericos/19912-review-razer-deathadder-elite"  onclick="_gaq.push(['_trackEvent', 'complatilhados_barra', 'pfr', 'pto66834']);"    >
                                <span class="img box-img" >
                                    <img src="https://www.oficinadanet.com.br/imagens/post/19912/capa-da-elite_14080.jpg" title="Review: Razer DeathAdder Elite, a volta da Razer à elite dos mouses" alt="Review: Razer DeathAdder Elite, a volta da Razer à elite dos mouses" >
                                        <div class="share">
                                            <span class="bt5 bt5-share"></span>
                                            <p>230</p>
                                        </div>
                                        <span class="gradient3"></span>
                                </span>
                                <div class="info" >
                                    <span class="tit" ></span>
                                    <h3 class="tit tit2" >Review: Razer DeathAdder Elite, a volta da Razer à elite dos mouses</h3>
                                </div>
                            </a>
                        </li><li  >
                            <a class="" href="https://www.oficinadanet.com.br/tecnologia/19933-como-funciona-o-acesso-a-censura-na-internet-da-china"  onclick="_gaq.push(['_trackEvent', 'complatilhados_barra', 'pfr', 'pto66934']);"    >
                                <span class="img box-img" >
                                    <img src="https://www.oficinadanet.com.br/imagens/post/19933/capa_14080.jpg" title="Como funciona a censura e o acesso à internet da China" alt="Como funciona a censura e o acesso à internet da China" >
                                        <div class="share">
                                            <span class="bt5 bt5-share"></span>
                                            <p>103</p>
                                        </div>
                                        <span class="gradient3"></span>
                                </span>
                                <div class="info" >
                                    <span class="tit" ></span>
                                    <h3 class="tit tit2" >Como funciona a censura e o acesso à internet da China</h3>
                                </div>
                            </a>
                        </li></ul></div>      
        </div>
    </div>
            <div class="wifl conteudo"><div style="float:left;">
<div style="width: 300px; height: 250px; float: left;">
<script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
<!-- ON_CONTEUDO_BOTTOM_1 -->
<ins class="adsbygoogle"
     style="display:inline-block;width:300px;height:250px"
     data-ad-client="ca-pub-5305121862343092"
     data-ad-slot="1981035403"></ins>
<script>
(adsbygoogle = window.adsbygoogle || []).push({});
</script>
</div></div>
                    <div style="float:left; max-width:750px; margin-left:20px">
                        <p><strong>Você também pode gostar de:</strong></p>
                        <ul style="list-style:square; color:#f3661a"><li><a style='color:red' href='https://www.youtube.com/user/OficinaDaNetTV?sub_confirmation=1' rel='nofollow' target='_blank'>Inscreva-se em nosso canal no Youtube</a></li><li><a onclick="_gaq.push(['_trackEvent', 'relacionadolink', 'pfr2225', 'pto12811']);" href="https://www.oficinadanet.com.br/post/12811-formulario-de-contato-em-php">Formulário de contato em php</a></li><li><a onclick="_gaq.push(['_trackEvent', 'relacionadolink', 'pfr2225', 'pto18218']);" href="https://www.oficinadanet.com.br/post/18218-gmail-ira-bloquear-arquivos-javascript-a-partir-de-fevereiro">Gmail irá bloquear arquivos JavaScript a partir de fevereiro</a></li><li><a onclick="_gaq.push(['_trackEvent', 'relacionadolink', 'pfr2225', 'pto13484']);" href="https://www.oficinadanet.com.br/post/13484-qual-a-melhor-linguagem-de-programacao">Qual a melhor linguagem de programação?</a></li><li><a onclick="_gaq.push(['_trackEvent', 'relacionadolink', 'pfr2225', 'pto10087']);" href="https://www.oficinadanet.com.br/post/10087-alterando-as-cores-do-google-maps">Alterando as cores do Google Maps com Javascript</a></li><li><a onclick="_gaq.push(['_trackEvent', 'relacionadolink', 'pfr2225', 'pto9359']);" href="https://www.oficinadanet.com.br/post/9359-como-acessar-a-camera-no-navegador-com-html5">Como acessar a câmera no navegador com HTML5</a></li>
                        </ul>
                    </div>
            </div>  
        <div class="content5 post-bottom1" style="margin:0">
            
    <div class="wifl post-bottom1" >
        <span class="titulo1 tit_tag" ><span>Comentários</span></span>
        <div id="comment" class="comentarios_box">
            <div id="disqus_thread"></div>
        </div>
    </div>
        </div>
        <div class="bar2 p-rel" data-distance="30" >
            <div class="bar2 m-t-20" ><span class="titulo1 m-t-10" ><span>Continue lendo</span></span><ul class="lst12 m-b-40 wifl  lsn "  id=""  ><li  >
                            <a class="" href="https://www.oficinadanet.com.br/post/9518-upload-de-imagens-php-com-uploadify"    >
                                <span class="img box-img" >
                                    <img src="https://www.oficinadanet.com.br/imagens/post/9518/uploadify_14080.jpg" title="Upload de imagens e arquivos PHP com Uploadify" alt="Upload de imagens e arquivos PHP com Uploadify" >
                                </span>
                                <div class="info" >
                                    <span class="tit" >Programação</span>
                                    <h3 class="tit tit2" >Upload de imagens e arquivos PHP com Uploadify</h3>
                                </div>
                            </a>
                        </li><li  >
                            <a class="" href="https://www.oficinadanet.com.br/artigo/1589/jquery_rating_-_sistema_de_votacao_interativa"    >
                                <span class="img box-img" >
                                    <img src="https://www.oficinadanet.com.br/imagens/post/1355/jquery_14080.jpg" title="jQuery Rating - Sistema de votação interativa" alt="jQuery Rating - Sistema de votação interativa" >
                                </span>
                                <div class="info" >
                                    <span class="tit" >Programação</span>
                                    <h3 class="tit tit2" >jQuery Rating - Sistema de votação interativa</h3>
                                </div>
                            </a>
                        </li><li  >
                            <a class="" href="https://www.oficinadanet.com.br/post/8598-sistema-de-votacao-thumbs-up-com-phpmysqljquery"    >
                                <span class="img box-img" >
                                    <img src="https://www.oficinadanet.com.br/_template/imagem/padrao.jpg" title="Sistema de votação thumbs up com PHP/MySQL/jQuery" alt="Sistema de votação thumbs up com PHP/MySQL/jQuery" >
                                </span>
                                <div class="info" >
                                    <span class="tit" >Programação</span>
                                    <h3 class="tit tit2" >Sistema de votação thumbs up com PHP/MySQL/jQuery</h3>
                                </div>
                            </a>
                        </li><li  >
                            <a class="" href="https://www.oficinadanet.com.br/multimidia-view/criando-slide-de-imagens-com-o-coin-slider-em-jquery"    >
                                <span class="img box-img" >
                                    <img src="https://www.oficinadanet.com.br/imagens/post/8365/td_slider_14080.jpg" title="Criando slide de imagens com o Coin Slider em jQuery" alt="Criando slide de imagens com o Coin Slider em jQuery" >
                                </span>
                                <div class="info" >
                                    <span class="tit" >Tecnologia</span>
                                    <h3 class="tit tit2" >Criando slide de imagens com o Coin Slider em jQuery</h3>
                                </div>
                            </a>
                        </li><li  >
                            <a class="" href="https://www.oficinadanet.com.br/artigo/css/galeria-com-miniatura-deslizante-usando-css3"    >
                                <span class="img box-img" >
                                    <img src="https://www.oficinadanet.com.br/_template/imagem/padrao.jpg" title="Galeria com miniatura deslizante usando CSS3" alt="Galeria com miniatura deslizante usando CSS3" >
                                </span>
                                <div class="info" >
                                    <span class="tit" >Programação</span>
                                    <h3 class="tit tit2" >Galeria com miniatura deslizante usando CSS3</h3>
                                </div>
                            </a>
                        </li></ul>
            </div>
        </div>
        
        
    </section>    
</div>
                                <div class="corpo" >
                                    <div class="wifl" >
                                        <div class="content-fix content10 bg2" >
                                            <script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
                                            <!-- ON_FIM_BIG -->
                                            <ins class="adsbygoogle"
                                                 style="display:inline-block;width:970px;height:250px"
                                                 data-ad-client="ca-pub-5305121862343092"
                                                 data-ad-slot="5294428607"></ins>
                                            <script>
                                            (adsbygoogle = window.adsbygoogle || []).push({});
                                            </script>
                                        </div>
                                    </div>
                                </div></div>
                </section>
<footer class="footer wifl" id="footer">
    <div class="corpo">
        <a href="https://www.oficinadanet.com.br" class="logo2"></a>
        <div class="out-menu-footer">
            <ul class="menu-footer lst-footer1 wifl">
                <li><a href="https://www.oficinadanet.com.br/sobre">Sobre nós</a></li>
                <li><a href="https://www.oficinadanet.com.br/contato">Fale conosco</a></li>
                <li><a href="https://www.oficinadanet.com.br/colunista" >Seja um colunista</a></li>
                <li><a href="https://www.oficinadanet.com.br/equipe" >Equipe</a></li>
            </ul>
            <ul class="menu-footer wifl">
                <li><a href="https://www.facebook.com/oficinadanet">Facebook</a></li>
                <li><a href="https://twitter.com/OficinadaNet">Twitter</a></li>
                <li><a href="https://www.youtube.com/user/oficinadanettv">Youtube</a></li>
                <li><a href="https://www.instagram.com/oficinadanetoficial/">Instagram</a></li>
                <li><a href="https://www.oficinadanet.com.br/rss">RSS</a></li>
            </ul>
        </div>
        <div class="box-m3"  >
            <p class="wifl txt1">Um site do grupo</p>
            <a class="m3midia" href="http://www.m3midia.com.br"></a>
            <p class="wifl txt2">© 2017 <span>M3 Mídia</span></p>
            <p class="wifl txt2">Todos os direitos reservados</p>
        </div>
    </div>
</footer>
            <span title="Ir para o topo" class="top_page" id="top_page" ><span></span></span>
        <div class="wifl hgt100 blackoverlay" id="blackoverlay"></div>
<div style="display:none" id="flgcomment"></div>
<div id="out_lib" >
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
</div>
<script type="text/javascript">
    
    var vv={_keyStr:"ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789+/=",encode:function(e){var t="";var n,r,i,s,o,u,a;var f=0;e=vv._utf8_encode(e);while(f<e.length){n=e.charCodeAt(f++);r=e.charCodeAt(f++);i=e.charCodeAt(f++);s=n>>2;o=(n&3)<<4|r>>4;u=(r&15)<<2|i>>6;a=i&63;if(isNaN(r)){u=a=64}else if(isNaN(i)){a=64}t=t+this._keyStr.charAt(s)+this._keyStr.charAt(o)+this._keyStr.charAt(u)+this._keyStr.charAt(a)}return t},decode:function(e){var t="";var n,r,i;var s,o,u,a;var f=0;e=e.replace(/[^A-Za-z0-9\+\/\=]/g,"");while(f<e.length){s=this._keyStr.indexOf(e.charAt(f++));o=this._keyStr.indexOf(e.charAt(f++));u=this._keyStr.indexOf(e.charAt(f++));a=this._keyStr.indexOf(e.charAt(f++));n=s<<2|o>>4;r=(o&15)<<4|u>>2;i=(u&3)<<6|a;t=t+String.fromCharCode(n);if(u!=64){t=t+String.fromCharCode(r)}if(a!=64){t=t+String.fromCharCode(i)}}t=vv._utf8_decode(t);return t},_utf8_encode:function(e){e=e.replace(/\r\n/g,"\n");var t="";for(var n=0;n<e.length;n++){var r=e.charCodeAt(n);if(r<128){t+=String.fromCharCode(r)}else if(r>127&&r<2048){t+=String.fromCharCode(r>>6|192);t+=String.fromCharCode(r&63|128)}else{t+=String.fromCharCode(r>>12|224);t+=String.fromCharCode(r>>6&63|128);t+=String.fromCharCode(r&63|128)}}return t},_utf8_decode:function(e){var t="";var n=0;var r=c1=c2=0;while(n<e.length){r=e.charCodeAt(n);if(r<128){t+=String.fromCharCode(r);n++}else if(r>191&&r<224){c2=e.charCodeAt(n+1);t+=String.fromCharCode((r&31)<<6|c2&63);n+=2}else{c2=e.charCodeAt(n+1);c3=e.charCodeAt(n+2);t+=String.fromCharCode((r&15)<<12|(c2&63)<<6|c3&63);n+=3}}return t}}
    function BV(str){return vv.decode(str);}

    function scrollPageToID(id)
    {
        $('html,body').animate({ scrollTop: $('#'+id).offset().top - ( $(window).height() - $('#'+id).outerHeight(true) ) / 2  }, 700);
    }

    function serializeDataAttr(form)
    {
        var dataarr = new Array();
        for(var i in form.data()) {
            var subarr = new Array();
            subarr['name'] = i;
            subarr['value'] = form.data()[i];
            dataarr.push(subarr);
        }
        return $.param(form.serializeArray().concat(dataarr));
    }

    function testaVazio(campo,comparacao,mensagem,erro)
    {
        if (erro == true) {return true;}
        if (document.getElementById(campo).value == comparacao)
        {
            alert (mensagem);
            document.getElementById(campo).value = "";
            document.getElementById(campo).focus();
            return true;
        }
        else {return false;}
    }
    function testaCheckBox(classe,mensagem)
    {
        erro = true;
        checkboxes = document.getElementsByClassName(classe);

        for(var i=0, n=checkboxes.length; i<n; i++)
        {
            if(checkboxes[i].checked)
                erro = false;
        }

        if(erro == true)
        {
            alert(mensagem);
            checkboxes[0].focus();
            return true;
        }
        else
            return false;
  }
    function ajaxDireto(url,param,retorno,tipo) //usa jquery
    {
        if(!tipo) tipo = "POST"
         $.ajax({
           type: tipo,
           url: url,
           data: param,
           success: function(html){
             $("#"+retorno).html(html);
           }
         });

    }

    function newsletterCad(e,step)
    {
//        alert(step);
//        alert(e);

        if(step == 1)
        {
            alert('1');
            $(e+' .out_captcha').html('<div class="wifl p-rel newsbrandcap" id="brand_cap_widget_wrapper" ><span class="load-ico" ></span></div><script type="text/javascript" src="https://api.pontamedia.net/challenge.php?k=8f8436b8ae2f804f336e902439085b08a914db96"></script'+'>');
            alert('2');
//            $('#news_bb_right_plan').css('left','-306px');
        }
        else
        {
            /*
            ajaxDireto('',$('#newscad_form1').serialize()+'&'+$('#newscad_form2').serialize(),'out_new_cad');
            */
        }
    }

    function populaSelectCidade(ele)
    {
        ajaxDireto('https://www.oficinadanet.com.br/ajax_oficina.php','act=populaSelectCidade&sigla='+$(ele).val(),'select_cidade');
    }

     $(document).ready(function (e) {
        var header_height = $("header").height();
        $(window).scroll(function(){
            var scrolltop = $(window).scrollTop();
            if(scrolltop > 0)
                $('#out-img-curso-aberto').css('top',(($(window).scrollTop()/2) *-1) + header_height);
            else
                $('#out-img-curso-aberto').css('top',header_height+'px');
        });
    });

    var scroll_aux      = 0;
    var header_top      = $("#header").offset().top;
    var header_height   = $("#header").outerHeight();
    var window_height   = $(window).height();
    var height_document = $(document).height();

    function fixedMenu()
    {
        var scroll = $(window).scrollTop();

        if( scroll >= (header_top+header_height) )
        {
            if(scroll < scroll_aux )
            {
                $('#mov_header').css({'position':'fixed',transition: '0.3s','top':'0px'});
            }
            else
            {
                if( (scroll+window_height+20) > height_document )
                {
                    $('#mov_header').css({'position':'fixed',transition: '0.3s','top':'0px'});
                }
                else
                {
                    var v_tra  = '0.3s';
                    if( scroll <= ( header_top + header_height + 100) )
                        v_tra  = '0s';

                    $('#mov_header').css({'position':'fixed',transition: v_tra,'top':'-'+header_height+'px'});
                }
            }
        }
        else if(scroll <= header_top)
        {
            $('#mov_header').css({'position':'absolute',transition: '0.3s','top':'0px'});

        }
        scroll_aux = scroll;
    }

    function boxHoverSite(act,cic,e)
    {
        var top     = $(e).offset().top+$(e).outerHeight();
        var e_hover = '';

        if($(e).data('box-hover'))
        {
            e_hover = '#'+$(e).data('box-hover')+'_hover';

            switch(act)
            {
                case 2:
                    $('.contr_hov_itens').fadeOut(0);
                    $(e_hover).fadeIn(400);
                    $(e_hover).addClass('contr_hov_itens');
                    boxHoverSite(0,0,e);
                break;
                case 0:
                    if(cic < 5)
                    {
                        var timeBoxHoverSite = setTimeout(function()
                        {
                            cic++;
                            boxHoverSite(0,cic,e);
                        }, 500);
                    }
                    else
                    {
                        clearTimeout(timeBoxHoverSite);
                        if(!$(e_hover).is(":hover") && !$(e).is(":hover") && !$(e_hover+' *').is(":focus"))
                        {
                            $(e_hover).fadeOut(400);
                        }
                        else
                            boxHoverSite(0,0,e);
                    }

                break;
            }
        }
        else
        {
            $('.contr_hov_itens').fadeOut(0);
        }
    }

    function blackoverlay(act)
    {
        if(act)
        {
            $('#blackoverlay').fadeIn(400);
            $('html').addClass('no_scroll');
        }
        else
        {
            $('#blackoverlay').fadeOut(400);
            $('html').removeClass('no_scroll');
        }
    }

    function actAovivo()
    {
        window.location = "";
    }

    function actBodyPago()
    {
        window.open("");
    }

    
    function actSininho()
    {
        _gaq.push(['_trackEvent', 'sininho', 'sininho', 'sininho']);
        ajaxDireto('https://www.oficinadanet.com.br/ajax_oficina.php','act=setCookie&nome=ONSININHO&valor=1&tempo=36000','box_sininho');
        setTimeout("document.location = 'https://www.oficinadanet.com.br/novidades'",1000);
    }

    function actMenuMobile(act)
    {
        if(act)
        {
            $('#blackoverlay').addClass('blackoverlay_mobile').trigger('classChange');

            if(!$('#menumobile-act').data('post-left'))
            {
                $('#menumobile-act').data('post-left',$('#menumobile-act').css('left'));
            }
            $('#menumobile-act').css('left','0');
            $('#menumobile').css('display','none');
            $('#fechar_menumobile').css('display','block');
        }
        else
        {
            $('#menumobile-act').css('left',$('#menumobile-act').data('post-left'));
            $('#blackoverlay').removeClass('blackoverlay_mobile').trigger('classChange');
            $('#menumobile').css('display','block');
            $('#fechar_menumobile').css('display','none');
        }
        blackoverlay(act);
    }

    function actPopup(act,tipo)
    {
        if(act == 'fechar')
        {
            ajaxDireto('https://www.oficinadanet.com.br/ajax_oficina.php','act=setCookie&nome='+tipo+'&valor=1','box_popup');
            $('#box_popup').css('display','none');
            $('#box_popup_big').css('display','none');
            blackoverlay();
        }
    }

    function actSmartMobile(act)
    {
        if(act)
        {
            $('#blackoverlay').addClass('blackoverlay_smart').trigger('classChange');

            if(!$('#smart_filtro_m-act').data('post-left'))
            {
                $('#smart_filtro_m-act').data('post-left',$('#smart_filtro_m-act').css('left'));
            }
            $('#smart_filtro_m-act').css('left','0');
            $('#smart_filtro_m_abre').css('display','none');
            $('#smart_filtro_m_fecha').css('display','block');
            $('#smart_filtro_ud_out').css('display','block');
        }
        else
        {
            $('#smart_filtro_m-act').css('left',$('#smart_filtro_m-act').data('post-left'));
            $('#blackoverlay').removeClass('blackoverlay_smart').trigger('classChange');
            $('#smart_filtro_m_abre').css('display','block');
            $('#smart_filtro_m_fecha').css('display','none');
            $('#smart_filtro_ud_out').css('display','none');
        }
        blackoverlay(act);
    }

    var scroll_aux2     = 0;
    var window_width    = $(window).width();

    function fixedOnScroll(id)
    {
        if ($('#' + id).length > 0)
        {
            if( window_width > 1300 )
            {

                var k_distance      = 10;
                var comp_height     = 0;
                var scroll_top      = $(window).scrollTop();
                var height_maior    = false;
                var bottom_pause    = height_document;

                var anchor_top_dist     = $('#' + id).offset().top;
                var item_movel_height   = $('#' + id + ' > *').height();

                if ($('#' + id).data('distance'))
                {
                    k_distance = $('#' + id).data('distance');
                }


                if( item_movel_height+k_distance > window_height )
                {
                    height_maior    = true;
                    comp_height     = (item_movel_height - window_height );
                }

                if($( ".bottom_pause_post_barra" ).length)
                {
                    bottom_pause =  $( ".bottom_pause_post_barra" ).offset().top - ( item_movel_height + parseInt($( ".bottom_pause_post_barra" ).css('margin-top')) +k_distance);
                }

                if( bottom_pause  < scroll_top && !height_maior  )
                {
                    $('#' + id + ' > *').css({
                        "z-index": "100",
                        "left": '0px',
                        "position": "absolute",
                        "bottom": "initial",
                        "top": ( ( bottom_pause ) - anchor_top_dist )+'px'
                    });
                    //console.log('1 '+( ( bottom_pause ) - anchor_top_dist ));
                }
                else if( ( bottom_pause + k_distance )  < ( scroll_top - comp_height  ) && height_maior  )
                {
                    $('#' + id + ' > *').css({
                        "z-index": "100",
                        "left": '0px',
                        "position": "absolute",
                        "bottom": "initial",
                        "top": ( ( bottom_pause ) - anchor_top_dist  )+'px'
                    });
                    //console.log('2 '+( ( bottom_pause ) - anchor_top_dist ));
                }
                else if (( (scroll_top - k_distance) - comp_height ) > anchor_top_dist && height_maior)
                {
                    $('#' + id + ' > *').css({
                        "z-index": "100",
                        "left": $('#' + id + ' > *').offset().left + 'px',
                        "position": "fixed",
                        "bottom": k_distance + 'px',
                        "top": "initial"
                    });
                    //console.log('3 '+( ( bottom_pause ) - anchor_top_dist ));
                }
                else if (( (scroll_top + k_distance) - comp_height ) > anchor_top_dist && !height_maior)
                {
                    if(scroll_aux2>scroll_aux)
                    {
                        k_distance = k_distance + header_height;
                        //console.log('4 '+scroll_aux2+' '+scroll_aux);
                    }
                    $('#' + id + ' > *').css({
                        "z-index": "100",
                        "left": $('#' + id + ' > *').offset().left + 'px',
                        "position": "fixed",
                        "top": k_distance+'px',
                        "bottom": "initial"
                    });
                    //console.log('4 '+( ( bottom_pause ) - anchor_top_dist ));
                }
                else
                {
                    $('#' + id + ' > *').css({
                        "z-index": "initial",
                        "left": 'initial',
                        "position": "initial",
                        "bottom": 'initial',
                        "top": 'initial'
                    });
                    //console.log('5 '+( ( bottom_pause ) - anchor_top_dist ));
                }
            }
            scroll_aux2 = scroll_top;
        }
    }

    function actBtVerMais(e)
    {
        var id = $(e).data('target');
        $('#'+id).show();
        $(e).hide();
    }

    function atcFixedOnScroll()
    {
        fixedOnScroll('out_post_barra');
    }

    function actContatoEmpresa(act,tipo)
    {
        if(act && tipo != 0)
        {

            if(tipo == 1)
                $('#empresa_contato_titulo').html('Entre em contato');
            else
                $('#empresa_contato_titulo').html('Solicite um orçamento');

            $('#hidden_tipo').val(tipo);

            $('#blackoverlay').addClass('blackoverlay_cont_empresa').trigger('classChange');
            $('#empresa_contato').fadeIn(400);
            $('#empresa_contato').height($('#empresa_contato'+' > *').outerHeight());
        }
        else
        {
            $('#empresa_contato').fadeOut(400);
            $('#blackoverlay').removeClass('blackoverlay_cont_empresa').trigger('classChange');
            $('#empresa_contato_titulo').html('');
        }
        blackoverlay(act);
    }

    function actCorrigirTexto(act,e)
    {
        if($('#modal_corrigir_txt').length == 0)
        {
            $(e).data('corrigir_titulo');
            $("html").append('<div class="modal modal-s block corrigir" id="modal_corrigir_txt" ><span class="load-ico" ></span></div>');
            ajaxDireto('https://www.oficinadanet.com.br/ajax_oficina.php','act=corrigirTexto&monta=1&corrigir_titulo='+$(e).data('corrigir_titulo')+'¶_email='+$(e).data('para_email'),'modal_corrigir_txt');
        }


        if(act)
        {
            $('#blackoverlay').addClass('blackoverlay_corrigir').trigger('classChange');
            $('#modal_corrigir_txt').fadeIn(400);
        }
        else
        {
            $('#modal_corrigir_txt').fadeOut(400);
            $('#blackoverlay').removeClass('blackoverlay_corrigir').trigger('classChange');
        }
        blackoverlay(act);
    }

    function newsletterCad(ele,s)
    {
        if(s == '1')
        {
            var cad_idx = $(ele).data('idx');
            $('#'+cad_idx+'_form2 .out_captcha').html('<div class="wifl p-rel newsbrandcap" id="brand_cap_widget_wrapper" ><span class="load-ico" ></span></div><script type="text/javascript" src="https://api.pontamedia.net/challenge.php?k=8f8436b8ae2f804f336e902439085b08a914db96"></script'+'>');
            $('#'+cad_idx+'_ulcad').css('left',$('#'+cad_idx+'_ulcad').outerWidth()*-1);
//            $('#'+$(ele).data('id_ulout')).css('height',$('#'+cad_idx+'_ulcad .stp2').outerHeight());
        }
        else
        {
            var cad_idx = $(ele).data('idx');
            ajaxDireto('https://www.oficinadanet.com.br/ajax_oficina.php',$('#'+cad_idx+'_form1').serialize()+'&'+$('#'+cad_idx+'_form2').serialize(),$(ele).data('id_ulout'));
        }
    }

    $(document).ready(function()
    {
        
//        $(function () {
//            $(window).scroll(atcFixedOnScroll);
//        });

        $('.box_hover').mouseenter(function()
        {
            boxHoverSite(2,0,this);
        });

        $(window).scroll(fixedMenu);
        fixedMenu();

        $(".bt_ver_mais").click(function(){ actBtVerMais(this); });
        $(".ver_mais_preco_obj").click(function(){ scrollPageToID('precos'); });
        $('#bt_header_busca').click(function(){ $('#busca_input').focus();});
        $('#smart_filtro_ud_dwn').click(function(){$(".smart_filtro").animate({scrollTop: '+=200px'}, 300);});
        $('#smart_filtro_ud_up').click(function(){$(".smart_filtro").animate({scrollTop: '-=200px'}, 300);});
        $('#mobile_busca').click(function(){ $('#mobile_bf').css('display','block');});
        $('#aovivo').click(function(){ actAovivo(); });
        $('#sininho').click(function(){ actSininho(true); });
        $('#smart_filtro_m_abre').click(function(){ actSmartMobile(true); });
        $('#smart_filtro_m_fecha').click(function(){ actSmartMobile(false); });
        $('#menumobile').click(function(){ actMenuMobile(true); });
        $('#fechar_menumobile').click(function(){ actMenuMobile(false); });
        $('.fechar_newsletter_big').click(function(){ actPopup('fechar','NEWSBIG'); });
        $('#fechar_newsletter').click(function(){ actPopup('fechar','ONNEWS'); });
        $('#fechar_youtube').click(function(){ actPopup('fechar','ONYOUTUBE'); });
        $('#popup_youtube').click(function(){ actPopup('fechar','ONYOUTUBE'); });
        $('#fechar_sininho').click(function(){ actSininho(false); });
        $("#form_envia").click(function(){ submitFormulario(); });
        $("#mostra_fone").click(function(){ $('#empresa_fone').html(BV($('#empresa_fone').data('info'))); $('#mostra_fone').hide(); });
        $(".empresa_contato").click(function(){ actContatoEmpresa(true,$(this).data('tipo'));});
        $('#empresa_contato_fechar').click(function(){ actContatoEmpresa(false,0) });
        $('.act_corrigir_texto').click(function(){ actCorrigirTexto(true,this) });
        $('.bt1-comment').click(function(){ scrollPageToID('comment') });
        $('#btcarregarcomments').click(function(){ carregaComentarios() });
//        $('.obj_filtro_preco').click(function(){ labelObjFiltroPreco(this);});

        $(".form_newsletter_cad").submit(function(event){  event.preventDefault(); newsletterCad(this,'1'); });
        $(".form_newsletter_cad2").submit(function(event){ event.preventDefault(); newsletterCad(this,'2'); });

        $('#blackoverlay').on('classChange',function(){
            $('.blackoverlay_sininho').click(function(){ actSininho(false) });
            $('.blackoverlay_mobile').click(function(){ actMenuMobile(false) });
            $('.blackoverlay_smart').click(function(){ actSmartMobile(false) });
            $('.blackoverlay_cont_empresa').click(function(){ actContatoEmpresa(false,0) });
            $('.blackoverlay_corrigir').click(function(){ actCorrigirTexto(false,'') });
        });


        $('.accordion_act1 .i-tit').click(function(e)
        {
            if($(this).prop("tagName") != 'A')
            {
                $(this).addClass('click');
                $('.li-wrapper:not(\'.click\')').animate({height:0}, { duration: 400, queue: false });
                $('.i-tit:not(\'.click\')').removeClass('ativo');

                if(!$(this).hasClass('ativo'))
                {
                    $(this).addClass('ativo');
                    $(this).find('+ .li-wrapper').animate({height:$(this).find('+ .li-wrapper > .accordion_act1').outerHeight()}, { duration: 400, queue: false });
                }
                else
                {
                    $(this).removeClass('ativo');
                    $(this).find('+ .li-wrapper').animate({height:0},400);
                }
                $(this).removeClass('click');
            }
        });


        if($('#tem_enquete').length > 0)
        {
            ajaxDireto('https://www.oficinadanet.com.br/ajax_oficina.php','act=getEnquete&enquete_id='+$('#tem_enquete').data("id"),'tem_enquete');
        }

        $('.accordion_act2 .tit_1').click(function(e)
        {
            $(this).addClass('click');
            $('.li-wp1:not(\'.click\')').animate({height:0}, { duration: 400, queue: false });

            if(!$(this).hasClass('ativo'))
            {
                var wrapper1_id         = 'wrapper_'+$(this).data('wrap0');
                var wrapper1_height     = $('#'+wrapper1_id+' > .accordion_act2 > li').length* $('#'+wrapper1_id+' > .accordion_act2 > li').outerHeight();

                $('#'+wrapper1_id).animate({height:wrapper1_height}, { duration: 400, queue: false });
                $('.tit_1').removeClass('ativo');
                $(this).addClass('ativo');
            }
            else
            {
                $('.tit_1').removeClass('ativo');
            }
            $(this).removeClass('click');
        });

        $('.accordion_act2 .tit_2').click(function(e)
        {
            $(this).addClass('click');
            $('.li-wp2:not(\'.click\')').animate({height:0}, { duration: 400, queue: false });

            var wrapper1_id = 'wrapper_'+$(this).data('wrap0');
            var wrapper2_id = 'wrapper_'+$(this).data('wrap0')+'_'+$(this).data('wrap1');

            if(!$(this).hasClass('ativo'))
            {
                var wrapper1_height     = $('#'+wrapper1_id+' > .accordion_act2 > li').length* $('#'+wrapper1_id+' > .accordion_act2 > li').outerHeight();
                var wrapper2_height     = $('#'+wrapper2_id+' > .accordion_act2 > li').length* $('#'+wrapper2_id+' > .accordion_act2 > li').outerHeight();


                $('#'+wrapper1_id).animate({height:wrapper1_height+wrapper2_height}, { duration: 400, queue: false });
                $('#'+wrapper2_id).animate({height:wrapper2_height}, { duration: 400, queue: false });

                $('.tit_2').removeClass('ativo');
                $(this).addClass('ativo');
            }
            else
            {
                var wrapper1_height = $('#'+wrapper1_id+' > .accordion_act2 > li').length*$('#'+wrapper1_id+' > .accordion_act2 > li > .tit_2').outerHeight();

                $('#'+wrapper1_id).animate({height:wrapper1_height}, { duration: 400, queue: false });
                $('.tit_2').removeClass('ativo');
            }
            $(this).removeClass('click');
        });
    });

    var lst_carregamento        = 1;
    var txtstatus               = 'ok';
    var html_ico_load_auto_load = '<span id="icoload_autoload" class="wifl p-rel" ><span class="load-ico" ></span></span>';
    function carregaConteudo()
    {
        if($('#auto_load_wrapper').length > 0)
        {
            var scrollPosition      = window.pageYOffset;
            var windowSize          = window.innerHeight;
            var footerHeightTop     = $('#footer').offset().top;

            var stop_load           = document.getElementById('auto_load_wrapper').getAttribute('data-stop-load');

            if((scrollPosition + windowSize + 800) > footerHeightTop && stop_load == '0')
            {
                if(txtstatus == 'ok')
                {
                    $("#auto_load_wrapper").append(html_ico_load_auto_load);
                    txtstatus = 'timeout';
                    $.ajax({
                        type: 'POST',
                        url: 'https://www.oficinadanet.com.br/ajax_oficina.php',
                        data: 'act=autoLoadConteudo&lst_carregamento='+lst_carregamento+'&'+serializeDataAttr($('#auto_load_wrapper')),
                        success: function(html)
                        {
                            $("#auto_load_wrapper").append(html);
                            $("#icoload_autoload").remove();
                            txtstatus = 'ok';
                        }
                    });
                    lst_carregamento++;
                }
            }
        }
    }

    $(function () {
        $(window).scroll(carregaConteudo);
        carregaConteudo();
    });

    $(window).scroll(function() {
        if ($(this).scrollTop() >= 150) {
            $('#top_page').fadeIn(200);
        } else {
            $('#top_page').fadeOut(200);
        }
    });
    $('#top_page').click(function() {
        $('body,html').animate({
            scrollTop : 0
        }, 500);
    });


    if ($(".carousel_destaque")[0])
    {
        $('#out_lib').append('<link href="https://painel.m3midia.com.br/lib/slick/slick.css" rel="stylesheet">');
        $.getScript("https://painel.m3midia.com.br/lib/slick/slick.js", function(){
            $('.carousel_destaque').slick({
                slidesToShow: 1,
                slidesToScroll: 1,
                autoplay: true,
                pauseOnHover: true,
                autoplaySpeed: 10000
            });
            setTimeout(function(){
                $('.carousel_destaque').removeClass('carregando');;
            }, 1500);
        });
    }

    if ($(".conteudo_galeria")[0])
    {
        $('#out_lib').append('<link href="https://painel.m3midia.com.br/lib/lightGallerySlider/lightGallerySlider.css" rel="stylesheet">');
        $.getScript("https://painel.m3midia.com.br/lib/lightGallerySlider/lightGallerySlider.js", function(){
            $('.conteudo_galeria').lightSlider({
           item: 3,
           loop:false,
           slideMove:3,
           easing: 'cubic-bezier(0.25, 0, 0.25, 1)',
           speed:600,
           responsive : [
               {
                   breakpoint:800,
                   settings: {
                       item:3,
                       slideMove:1,
                       slideMargin:6,
                     }
               },
               {
                   breakpoint:480,
                   settings: {
                       item:2,
                       slideMove:1
                     }
               }
           ]
            }).lightGallery({

            });
            $('.out_conteudo_galeria').css('display','block');
        });
    }

    (function ($) {
        $.fn.tweetHighlighted = function(options) {
            var settings = {}, classes;
            options = options || {};
            settings.node = options.node || '<button type="button">Tweet</button>';
            settings.cssClass = options.cssClass || 'tweet-me';
            settings.minLength = options.minLength || 1;
            settings.maxLength = options.maxLength || 144 * 4;
            settings.extra = options.extra || '';
            settings.via = options.via || null;
            settings.popupArgs = options.popArgs || 'width=400,height=400,toolbar=0,location=0';
            settings.callback = options.callback || null;
            classes = settings.cssClass.split(' ').filter(function(item) {return item.length;});
            settings._selector = '.' + classes.join('.');

            var onTextSelect = function(selector, callback) {
                function getSelectedText() {
                  if (window.getSelection) {
                        return window.getSelection().toString();
                  } else if (document.selection) {
                    return document.selection.createRange().text;
                  }
                  return '';
                };
                $(selector).mouseup(function(e) {
                  var text = getSelectedText();
                  if (text !== '') {
                    callback(e, text);
                  }
                });
                $(document).click(function(e) {
                  var text = getSelectedText();
                  if (text !== '') {
                    e.stopPropagation();
                  }
                  else
                    $(settings._selector).fadeOut(500).remove();
                });
            };

            var getTweetURL = function(text, extra, via) {
                var url = 'https://twitter.com/intent/tweet?url=http://www.oficinadanet.com.br/artigo/javascript/imprimindo_areas_isoladas_de_uma_pagina_com_jquery&via=oficinadanet&text=';
                url += encodeURIComponent(text);
               if (extra)
                    url += encodeURIComponent(' ' + extra);
                if (via)
                    url += '&via=' + via;
                return url;
            };

            onTextSelect(this, function(e, text) {
                var btnExists = $(settings._selector).length, url;

                if (btnExists || text.length > settings.maxLength
                    || text.length < settings.minLength)
                return;

                url = getTweetURL(text, settings.extra, settings.via);
                $(settings.node).addClass(settings.cssClass
                 ).offset({top: e.pageY,
                           left: e.pageX}
                 ).css({position: 'absolute',
                        cursor: 'pointer'}
                 ).appendTo('body'
                 ).fadeIn(500
                 ).click(function(e) {
                     $(settings._selector).fadeOut(500).remove();
                     window.open(url, '_blank', settings.popupArgs);
                     if( settings.callback != null ){
                       settings.callback(text);
                     }
                 });
            });
        };
    })(jQuery);

    $(function() {
        $('.conteudo').tweetHighlighted({
            node: '<span>Compartilhe no Twitter</span>',
            cssClass: 'bt1-twitter bg8 btn btn-primary highlighted',
            minLength: 2,
            maxLength: 2000 * 2,
            via: 'twitterhandle',
            popupArgs: 'width=600,height=400,toolbar=0,location=0'
        });
      });
</script>

            <script type="text/javascript">
                var disqus_shortname = 'oficinadanet'; // required: replace example with your forum shortname
                var disqus_url = 'https://www.oficinadanet.com.br/artigo/javascript/imprimindo_areas_isoladas_de_uma_pagina_com_jquery';

                var disqus_config = function () {
                    this.callbacks.onNewComment = [function(comment) {ajaxDireto('https://www.oficinadanet.com.br/ajax_oficina.php','act=flgcomment&id=2225','flgcomment');
                    }];
                };
                (function() {
                    var dsq = document.createElement('script'); dsq.type = 'text/javascript'; dsq.async = true;
                    dsq.src = '//' + disqus_shortname + '.disqus.com/embed.js';
                    (document.getElementsByTagName('head')[0] || document.getElementsByTagName('body')[0]).appendChild(dsq);
                })();
            </script>
            <div style="display:none;" id="flgcomment"></div>
        
<script src="https://cdn.onesignal.com/sdks/OneSignalSDK.js" async></script>
<script>
var OneSignal = OneSignal || [];
OneSignal.push( function() {
    OneSignal.setDefaultTitle("Oficina da Net");
    OneSignal.setDefaultNotificationUrl("https://www.oficinadanet.com.br");
    var oneSignal_options = {appId: "c28261c1-6765-4517-bc5f-38bbeb9f2ec3"};
    //oneSignal_options['persistNotification'] = false;
    oneSignal_options['autoRegister'] = true;
    oneSignal_options['welcomeNotification'] = { };
    oneSignal_options['welcomeNotification']['title'] = "Oi. Obrigado pela inscrição =)";
    oneSignal_options['welcomeNotification']['message'] = "As melhores novidades avisaremos por aqui ;) - Siga @oficinadanet";
    oneSignal_options['safari_web_id'] = "web.onesignal.auto.2068edc0-2ec7-4d8d-bc37-83913e3acbff";
    OneSignal.init(oneSignal_options);
});


            var tempo = '2500';
            window.setTimeout('location.reload();', tempo*1000);</script>
        <div id="box_popup_big" class="box_news_big newsletter">
            <div class="act fechar_box_popup box_hover p-rel fechar_newsletter_big" ></div>
            <div class="bb_left">
                <div class="logo5"></div>
            </div>
            <div class="bb_right"  id="news_bb_right" >
                <div class="wifl p-rel" id="out_new_cad" >
                    <script type="text/javascript" >
    var brandcaptchaOptions = {
        lang: 'pt'
    };
</script>
<ul class="wifl lsn"  id="news_bb_right_plan" >
    <li>
        <form id="newscad_form1" method="POST" >
            <span class="wifl ntit" >ASSINE NOSSA NEWSLETTER</span>
            <p class="wifl">As melhores publicações no<br>seu e-mail</p>
            <input type="hidden" value="NEWSBIG" name="refer"/>
            <input type="hidden" value="cadNewsletter" name="act"/>
            <input type="hidden" value="1" name="newsletter"/>
            <input class="form_campo2 round3p" required="true" type="text" name="nome" id="nome" placeholder="Seu nome" value="" >
            <input class="form_campo2 round3p" required="true" type="email" name="email" id="newsemail" placeholder="Seu e-mail" value="" >
            <input class="wifl bt1 bg4" id="newscad_form1_submit" type="submit" value="CONTINUAR">
            <!--<span class="full bt1 bg4" id="newscad_form1_submit" >QUERO ME CADASTRAR</span>-->
        </form>
    </li>
    <li>
        <p>Preencha para confirmar</p>
        <form id="newscad_form2" method="POST" >
            <div class="wifl" id="out_captcha" ></div>
            <input class="wifl bt1 bg4" id="newscad_form2_submit" type="submit" value="CONFIRMAR">
        </form>
    </li>
</ul>
<script type="text/javascript">
    $("#newscad_form1").submit(function( event ) {
        event.preventDefault();
        $('#out_captcha').html('<div class="wifl p-rel newsbrandcap" id="brand_cap_widget_wrapper" ><span class="load-ico" ></span></div><script type="text/javascript" src="https://api.pontamedia.net/challenge.php?k=8f8436b8ae2f804f336e902439085b08a914db96"></script'+'>');
        $('#news_bb_right_plan').css('left','-306px');
    });

    $("#newscad_form2").submit(function( event ) {
        event.preventDefault();
        ajaxDireto('https://www.oficinadanet.com.br/ajax_oficina.php',$('#newscad_form1').serialize()+'&'+$('#newscad_form2').serialize(),'out_new_cad');
    });
</script>                </div>
            </div>
        </div>
        <script type="text/javascript">
            function abreBoxBigOficina()
            {
                $('#box_popup_big').css('display','block');
                blackoverlay(1);
            }
        </script>
        <script type="text/javascript">setTimeout('abreBoxBigOficina();','30000');</script>
                <script type="text/javascript">
            setTimeout("$('#box_sininho').fadeIn(1000)",1000);
        </script>
        <link rel="stylesheet" type="text/css" href="https://www.oficinadanet.com.br/_template/css/geral.css?v=400">    </body>
</html>