Slides com JavaScript

30 de Março



Um ótimo recurso, segue abaixo

HTML

    <!– CONTENEDOR –>
    <div id=”slides_content”>
    <!– LISTADO DE ITEMS –>
    <ul class=”buttons”>
    <li><a id=”current” href=”javascript:void(0)” onclick=”change(0,this);”>Slide 01</a></li><li><a href=”javascript:void(0)” onclick=”change(520,this);”>Slide 02</a></li>
    <li><a href=”javascript:void(0)” onclick=”change(1040,this);”>Slide 03</a></li>
    <li><a href=”javascript:void(0)” onclick=”change(1560,this);”>Slide 04</a></li>
    </ul>

    <!– ELEMENTOS –>
    <div id=”elementos” style=”width:2100px; margin:0 0 0 0;”>
    <!– SLIDE 01 –>

    <div class=”slide 1″>
    <h2>Title Content Slide 01</h2>
    <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Quisque consequat tincidunt libero. Aenean euismod. Aenean tempus. Praesent purus dui, aliquam congue, aliquam eget, mattis vitae, libero. Integer sagittis magna quis mi. Donec iaculis odio vel purus. Morbi erat. Nam et libero. Proin eleifend elit quis enim. Vivamus sagittis nibh nec tellus. Donec lectus. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae.</p>
    <p>Cras scelerisque mi auctor orci. Nullam laoreet. Sed gravida. Donec tellus arcu, hendrerit eu, fermentum consequat, accumsan at, dui. Sed a ipsum. Praesent sagittis. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos hymenaeos. Sed eu massa vitae nibh dictum mollis. Aliquam viverra. Suspendisse id enim. Mauris lobortis ante nec tellus. Aliquam interdum nisi vel nisl. Integer congue augue. Sed justo. Donec dui mi, imperdiet non, molestie sit amet, tristique ut, dui. Donec interdum elit ac nisl. Sed vitae lacus sed pede molestie placerat. Aenean faucibus consectetuer pede. </p>
    </div>
    <!– SLIDE 02 –>
    <div class=”slide 2″>

    <h2>Title Content Slide 02</h2>
    <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Quisque consequat tincidunt libero. Aenean euismod. Aenean tempus. Praesent purus dui, aliquam congue, aliquam eget, mattis vitae, libero. Integer sagittis magna quis mi. Donec iaculis odio vel purus. Morbi erat. Nam et libero. Proin eleifend elit quis enim. Vivamus sagittis nibh nec tellus. Donec lectus. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae.</p>
    </div>
    <!– SLIDE 03 –>
    <div class=”slide 3″>
    <h2>Title Content Slide 03</h2>
    <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Quisque consequat tincidunt libero. Aenean euismod. Aenean tempus. Praesent purus dui, aliquam congue, aliquam eget, mattis vitae, libero. Integer sagittis magna quis mi. Donec iaculis odio vel purus. Morbi erat. Nam et libero. Proin eleifend elit quis enim. Vivamus sagittis nibh nec tellus. Donec lectus. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae.</p>

    <p>Cras scelerisque mi auctor orci. Nullam laoreet. Sed gravida. Donec tellus arcu, hendrerit eu, fermentum consequat, accumsan at, dui. Sed a ipsum. Praesent sagittis. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos hymenaeos. Sed eu massa vitae nibh dictum mollis. Aliquam viverra. Suspendisse id enim. Mauris lobortis ante nec tellus. Aliquam interdum nisi vel nisl. Integer congue augue. Sed justo. Donec dui mi, imperdiet non, molestie sit amet, tristique ut, dui. Donec interdum elit ac nisl. Sed vitae lacus sed pede molestie placerat. Aenean faucibus consectetuer pede. </p>
    </div>
    <!– SLIDE 05 –>
    <div class=”slide 4″>
    <h2>Title Content Slide 04</h2>
    <p>Cras scelerisque mi auctor orci. Nullam laoreet. Sed gravida. Donec tellus arcu, hendrerit eu, fermentum consequat, accumsan at, dui. Sed a ipsum. Praesent sagittis. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos hymenaeos. Sed eu massa vitae nibh dictum mollis. Aliquam viverra. Suspendisse id enim. Mauris lobortis ante nec tellus. Aliquam interdum nisi vel nisl. Integer congue augue. Sed justo. Donec dui mi, imperdiet non, molestie sit amet, tristique ut, dui. Donec interdum elit ac nisl. Sed vitae lacus sed pede molestie placerat. Aenean faucibus consectetuer pede. </p>
    </div>

    </div>
    <!– TERMINA ELEMENTOS –>
    </div>
    <!– TERMINA EL CONTENDOR –>

JavaScript

    /*//////////////////////////////////////////////////////////
    /////////////Codigo original: Azer Koçulu//////////////////
    /////////////Modificado: Infected-FX//////////////////////
    /////////////////www.infectedfx.net//////////////////////
    ///////////////////////////////////////////////////////*/

    function change(x,item)
    {
    document.getElementById(”current”).id = “”;
    item.id = “current”;
    if((x * (-1))<(getElementPosition(”elementos”).left - 10)){
    distance = (x + getElementPosition(”elementos”).left) / 5;
    start = getElementPosition(”elementos”).left;
    for(i=0; i<=distance; i++){
    setTimeout(”document.getElementById(\”elementos\”).style.margin = \”0 -” + ((start * (-1)) + (i*5)) + “px\”", i*5);
    if(i==distance){
    setTimeout(”document.getElementById(\”elementos\”).style.margin = \”0 -” + x + “px\”", i*5);
    }
    }
    }else if((x * (-1))>(getElementPosition(”elementos”).left)){
    distance = ((x + getElementPosition(”elementos”).left) / 5) * (-1);
    start = getElementPosition(”elementos”).left;
    for(i=0; i<=distance; i++){
    setTimeout(”document.getElementById(\”elementos\”).style.margin = \”0 -” + ((start * (-1)) - (i*5)) + “px\”", i*5);
    if(i==distance)
    setTimeout(”document.getElementById(\”elementos\”).style.margin = \”0 -” + x + “px\”", i*5);
    }
    }
    }

    function getElementPosition(object){
    var position = new Object;
    position.left = parseInt(document.getElementById(object).style.marginLeft)
    position.top = parseInt(document.getElementById(object).style.marginTop)
    return position;
    }

CSS

    /*///////////////////
    ///// SLIDES JS /////
    ///////////////////*/

    /* GENERALES*/

    body {
    font:12px Arial, Helvetica, sans-serif;
    color:#818181;
    }

    a {
    outline:none;
    text-decoration:none;
    }

    a:link,
    a:visited {color:#006699;}
    a:hover {color:#00CCFF;}

    .center {text-align:center;}

    /* CONTENIDO GLOBAL*/
    #slides_content {
    width:520px; /* ANCHO DEL CONTENEDOR*/
    overflow:hidden;
    margin:auto;
    }

    /* HEADERS */
    #slides_content h2 {
    font:24px Arial;
    letter-spacing:-1px;
    font-weight:bold;
    margin:5px;
    color:#FF6600;
    }

    /* SLIDE */
    #slides_content .slide {
    float:left;
    width:500px; /* ANCHO DE CADA SLIDE */
    height:300px; /* ALTURA DE CADA SLIDE */
    padding:10px;
    border-top:5px solid #7596B7;
    }

    /* LISTA DE ITEMS */
    .buttons{
    text-align:center;
    width:500px; /* ANCHO DEL MENU */
    clear:both;
    display:block;
    list-style:none;
    white-space: nowrap;
    padding:0px;
    margin:0px 0px 0px 0px;
    }

    .buttons li{
    display: inline;
    list-style-type: none;
    }

    .buttons li a{
    text-align:center;
    margin:0px 3px 0px 0px;
    padding:8px 14px;
    line-height:31px;
    }

    .buttons li a:link,
    .buttons li a:visited{
    background-color:#B5CADF; color:#000;
    }

    .buttons li a:hover{
    color:#FFFF00;
    background-color:#7596B7;
    }

    .buttons li a#current{
    background-color:#7596B7;
    color:#FFF;
    }

Exemplo

Fonte: http://www.infectedfx.net/

Bookmark e Compartilhe
Comentários (0)

Está eu não conhecia, estava eu navegando pelo Stumble e pimba, dei de cara com o E-mail Address Encoder, basta colocar o endereço de e-mail clicar no botão “encode”, prontinho teu endereço de e-mail codificado.

Bookmark e Compartilhe
Comentários (0)



Com o início do ano os piratas cibernéticos preparam novas ameaças para usuários de e-mail em todo o planeta, entre elas spams, vírus e ataques de phishing e malwares. Confira algumas dicas que ajudam a evitar essas pragas virtuais.

1) Não abra

Sempre que possível não abra spams. Essas mensagens normalmente vêm acompanhadas de softwares que permitem que o seu criador saiba quantos e quais endereços receberam e abriram a mensagem. Um email suspeito quase sempre é um spam.

2) Não responda

A melhor forma de lidar com e-mails de endereços suspeitos ou desconhecidos é excluí-los ou deixar que um filtro antispam coloque-os em quarentena. Se responder a um spam, mesmo solicitando sua remoção da lista, você estará confirmando ao remetente que esse é um endereço válido e provavelmente sua caixa de correio será alvo de mais spams. Na dúvida sobre a legitimidade de uma mensagem solicitando informações, entre em contato com a empresa ou digite o URL da companhia no seu navegador.

3) Não clique

Se clicar em um link (mesmo em “unsubscribe”) da mensagem, poderá infectar seu computador com um spyware ou vírus. Exclua o email imediatamente. Caso a mensagem pareça ser do seu banco, operadora de cartão de crédito ou qualquer outra empresa solicitando a validação das suas informações, não o faça. Eles já possuem informações sobre sua conta, portanto não precisam de qualquer tipo de validação ou confirmação. Exclua a mensagem. Se estiver em dúvida, ligue diretamente para a empresa.

4) Não compre

Os spams existem porque são lucrativos. Não custa praticamente nada para o criador do spam enviar milhões de mensagens. Se uma das pessoas cair, ele já está no lucro. Nunca compre nada anunciado em spams e peça para os seus amigos e familiares fazerem o mesmo, por mais atraente que a oferta possa parecer.

5) Não use seu endereço de e-mail principal

Fornecer seu endereço principal em qualquer lugar na web é um grande risco e ótimo para os criadores de spam. Para transações on-line, use um segundo endereço.

6) Confiras as políticas de segurança

Cuidado ao fornecer informações em newsgroups, preencher formulários na web ou fornecer seu endereço eletrônico em sites. Confira as políticas de segurança do site para garantir que seu email não será compartilhado com outras empresas.

7) Verifique se o seu provedor possui proteção contra spams, vírus e spyware

Os spams normalmente contêm vírus, daí a importância da proteção antispam e antivírus . As mensagens de spam freqüentemente possuem links para sites com spywares ou malwares. Verifique junto ao seu provedor ou departamento de TI se há proteção contra esses tipos de ameaças. A proteção contra spams, vírus e malwares no gateway podem fazer toda a diferença.

8) Use seu bom senso

Se para você parece spam, provavelmente deve ser. Exclua.

Fonte: http://wnews.uol.com.br

Bookmark e Compartilhe
Comentários (0)

Não sei por que cargas d’água M$ internet explorer não lê corretamente o “min-height”, bom procurei no google e achei um esquema legal, que funcionou, segue abaixo:

    Cascading Style Sheet
    /* for understanding browsers */
    .container {
    width:20em;
    padding:0.5em;
    border:1px solid #000;
    min-height:8em;
    height:auto;
    }
    /* for Internet Explorer */
    /*\*/
    * html .container {
    height: 8em;
    }
    /**/

Bookmark e Compartilhe
Comentários (0)

No site mashable.com achei uma lista enorme de aplicações open-source, vale a pena conferir, achei várias que nunca tinha ouvido falar.

Segue uma pequena lista

FrontAccounting - A professional web-based accounting system for ERP chain; written in PHP with use of MySQL.

bbLean - A new version of Blackbox for Windows.

CyGNOME - A nice tool which ports GNOME desktop to Windows.

Sylpheed-Claws - An open source email client with an interface similar to Outlook Express; works as an RSS feed reader too.

Thunderbird - A secure email client with several customization options to fit the user’s needs.

Clique aqui e veja a lista completa.

Bookmark e Compartilhe
Comentários (2)

Copyright © 2008 - Todos os direitos reservados.

diHITT - Notícias BlogBlogs.Com.Br