| Maior acervo de vídeo aulas da web

Não consegue visualizar a vídeo aula?

DIV com bordas arredondadas com Jquery

Olá para todos! Meu nome é Matheus Moura, e nesta vídeo aula vou ensinar a colocar bordas arredondadas em uma div utilizando o jquery com o p lugin corner. Boa aula!

Link do Jquery: jquery
Link do Plugin: Corner

Obs. VAB: O autor informa na sua vídeo aula que está usando ajax para criar bordas arrendondas, sendo que ajax é um acrônimo Asynchronous Javascript And XML. Isso significa, de modo simplificado que seu navegador irá solicitar informações ao servidor sem necessidade de atualizar a página. Então ele não está usando AJAX para criar esse efeito.

Você gostou dessa Vídeo Aula, então compartilhe com seus amigos

Artigos Relacionados

  • No Related Post

Comentários

  • Reginaldo Santana

    Olá Matheus! tudo blz parabéns pelas suas aulas são show…
    Tenho uma dúvida sobre a vídeo “DIV com bordas arredondadas com Jquery”, onde encontrar o pluguin jquery.corner.src.js, não consegui encontrar. Pode me ajudar…
    E aproveitando a oportunidade gostaria de sugerir uma vídeo aula que acho ser bem interessante. Como criar o recurso autocompletar do google, ou seja, a pessoa começa a digitar a palavra e automaticamente vão surgindo as opções? Fica ai a sugestão té+

    • http://www.videoaulasbrasil.com.br David CHC

      @Reginaldo, não necessidade de colocar aqueles dois plugin, q são os mesmos, um é para produção, removido os espaços, e outro para desenvolvimento, q tem os comentários, então não necessidade de colocar os dois, apenas usar jquery.corner

  • Junior Batista

    Opá!!! Massa! fazer isso só com o CSS da muito trabalho, Otima dica!! Valeu!

  • Sergio Araujo – SP

    Ola Matheus, blz…

    Fantastica essa video aula, muito bom saber essa como Jquery, mais uma vez aprendi uma boa novidade e espero encontrar outras. Agora pergunto, todas aquelas formas de cantos que vc menciona, existe alguma listagem para conhecer todas ?

    Abraços e parabens.

  • http://www.matheusmoura.com Matheus

    Boa dia pessoal! Bom, vocês podem baixar o plugin e o jQuery no link que tem na descrição desta vídeo aula. No link do plugin também tem todos os modos de cantos, porque na aula só ensinei alguns. Vlw gente!

  • Emmerson Siqueira

    Acontece que quando você utiliza imagem, ele deixa as bordas arredondadas, mas… ele deixa as pontas com a cor branca! e isso não fica bom com layout de background que seja diferente de branco.

  • http://www.matheusmoura.com Matheus

    Bom, ai já é com você! Eu ensinei a fazer com background em css, assim que tenho conhecimento. Nunca testei com imagens, então…
    Vlw!

  • http://tutorial-city.net Tutorial City

    Pra bordas arredondadas acho melhor usar as extensões específicas dos navegadores(que suportam)(CSS3), e deixar quadrado nos outros, a não ser que a borda arredondada seja realmente necessário.
    Cuidado com a nomenclatura, o vídeo não teve absolutamente nada de AJAX, somente javascript.

  • http://www.matheusmoura.com Matheus

    Tutorial City, por isso que os administradores colocaram uma observação no final da descrição da aula. Bom, acredito que o mais importante seja passar o conteúdo, e todo mundo comete erros, então perdoem-me por falar AJAX e não jQuery, que seria o correto! Vlw!

  • ricardo

    David eu tenho uma dúvida,fiz esse login e senha desse site por sinal muito bom, mais eu preciso tbm de uma coisa… tem como vc fazer uma página pra tipo quando a pessoa se cadastrar ele ter uma página individual… Que ele possa colocar as fotos dele e tal . Por favor faz isso pra mim, espero resposta … abraço!

    • http://www.videoaulasbrasil.com.br David CHC

      Ricardo, vamos dizer q vc quer q pessoa cadastre fotos, então sua tabela teria q ser assim:

      fotos

      id_fotos
      id_user
      foto
      legenda

      O id_user será o id do usuário quando logar no sistema, vc recuperar esse id pela sessão

  • Rafael

    Matheus, muito boa sua vídeo aula, realmente está muito bem explicado, sei que vc fez de coração para disponibilizar seus conhecimnetos para os irmões da net.
    Matheus fiz o código Html,css e coloquei e fiz o down dos arquivo, Mas tá faltando um arquivo JS.
    Tem como vc colocar dispnível para down por gentileza.
    Um forte abraço e sucesso!

  • http://www.matheusmoura.com Matheus Moura

    RAFAEL, é porque na aula eu que coloquei arquivo demais. Você só precisa de um arquivo do plugin e do arquivo do jQuery, apenas estes. Só é necessario colocar o “jquery.js” e o “jquery.coner.js”. O “jquery.corner.src.js” não é necessário colocar. Vlw.

  • Ricardo

    E como é que faz pra q cadastre ids diferentes ?

  • Ricardo

    E como q faz pra quando a pessoa se cadastrar crie ID_USER diferente?

    • http://www.videoaulasbrasil.com.br David CHC

      Ricardo, cada usuario terá um Id único. Lembre-se q é criado uma chave primaria, isso q dizer ela será unica. Peço apenas q poste essas duvidas no comentários referente a esse video aula.

  • http://www.narutorox.com Allan lima

    Valeu cara….. Muito Obrigado . tava precisando demais desse video =) Otima aula !

  • http://www.narutorox.com Allan lima

    Comentario atrasado é q eu tava andando muito ocupado =) mas valeu , ajudo eu muitoooo , mto obrigado mesmo =]

  • http://www.cursopadrao.com.br marcelo lima

    muito bom mesmo, parabens e ja aproveitando a oportunidade quero soliciatar se possivel fazer um borda arredondada igual o do logo do site:www.r7.com , muito obrigado estou esperando essa aula ate mais.

  • Gustavo

    Peço que estude andes de realizar as video aulas. OBS na barra de STATUS ninguem le. E vamos dizer que esta não é a forma conselhavel de se fazer isto. Muitos kbs, desperdiçados.

    • http://www.videoaulasbrasil.com.br David CHC

      @Gustavo, existe nº maneiras de fazer box com cantos arrendondados, essa pode ser uma alternativa muito eficaz.
      Sobre a Obs proposto pelo VAB, apareceu pequeno devido algumas configurações no itálico, agora está num tamanho legivel.

  • http://cooperativanaweb.blogspot.com/ Alex Rodrigues – 30 anos – Campinas-sp

    Olá Matheus tudo bem , cara video aula ótima cara muito ótima.
    Cara se vc souber wordpress sera que vc pode fazer uma video aula de query_post.

    Muito Obrigado pela video aula e continue assim!!!

  • Rafael

    Vlw Matheus, a questão que fiz o códigos como vc fez na vídeo aula e não funcionou.
    Ai surgiu a dúvida sobre o terceiro JS a razão de não funcionar.
    Enfim a BOX ficou quadrada.
    Não sei o que fiz de errado, fiz o código da mesma forma que a vídeo aula.
    Peço uma ajuda
    Muito obrigado
    Abraço

  • http://www.matheusmoura.com Matheus

    Bom dia rapaziada! Bom, com certeza existem diversas formas de fazer isto, e, esta (<-) é uma dessas. Se não funcionou com algumas pessoas, recopie o codigo, por que está tudo certo com a maioria das pessoas. Obrigado. Vlw.

  • http://www.cursopadrao.com.br marcello lima

    ola amigo tudo bem, aqui o meu tambem nao deu certo o que sera que fiz errado. vc pode me ajudar.

  • http://www.matheusmoura.com Matheus

    Gente, é só fazer o que a aula diz.. Exatamente igual. Qualquer coisa falem-me.

  • rollou

    O meu também não esta dando certo. Já refiz o código 3vezes. O que pode estar errado. Desde já Obrigado.

  • http://www.matheusmoura.com Matheus

    Então por favor enviem para ma.us100@hotmail.com os arquivos em anexo. Para eu dar uma olhada. Ou podem me adicionar no msn!

  • Guilherme

    Vlw mesmo cara! parabens pelo video… o meu aqui deu certinho!

    abraços!

  • http://www.dimasdecampos.com Dimas

    Show a video aula.
    Gostaria que alguém me dissesse como trabalhar com jquery no wordpress, tipo atualizar o jquery e trabalhar com ele no wordpress, pois tentei colocar este plugin em um site que fiz só que dava conflito com alguns scripts do wordpress.
    Ou funcionava um ou outro.
    Agradeço desde já.

    • http://www.videoaulasbrasil.com.br David CHC

      @Dimas, em vez de vc usar $ para seletor, use o jQuery para evitar conflito, exemplo:


      jQuery(document).ready(function() {
      jQuery(‘#id_da_Div’).corner();
      });

  • http://www.dimasdecampos.com Dimas

    David, muitíssimo obrigado funcionou blz.

    • http://www.videoaulasbrasil.com.br David CHC

      Blz @Dimas :D

  • http://www.in4tek.com.br Alexandre

    Boa noite(a hora que escrevo).
    nessa videoaula vc fala em usar 3 scripts, porem no site só tem 2 links, como eu consigo o corner.src ?

    obrigado desde já

    • http://www.videoaulasbrasil.com.br David CHC

      @Alexandre, não há necessidade de 3 script, apenas 2, o do jquery e do plugin. O Do plugin vc vai encontrar sempre 2 arquivos, pq um é para desenvolvimento, o q isso significa? Quer dizer ele é organizado e comentado para vc olhar e saber como é feito. E outro é o de produção (sempre é o q tem menor tamanho), ele já não tem comentário, espaços, e as vezes usado função para criptografar pra ficar menor ainda. Qual usar? Os dois scripts são iguais, mas use o de produção (o menor), e para ver como funciona, vc ver o de desenvolvimento.

  • Sacramento

    Não é um bom plugin. Ele só é bom com background Branco, se tiver uma imagem atrás ou um degradé, só funcionará nos navegadore que suportam CSS3, os IE e Opera não funcionam porque deixa as pontas brancas da DIV que foi arredondada.

    O melhor que já vi é o http://www.curvycorners.net/

    Funciona em todos os navegadores idependente da imagem ou fundo atrás.

  • Leonardo Tavares

    Matheus parabéns! Teria como aplicar esse efeito em campos input?

  • webson

    parabens super video aula…. vivendo e aprendendo.. obrigadão pessoal da vab

  • webson sousa

    os scripts desta video aula está no forum? nao estou conseguindo acha, obrigado


Hospedado por Hostnet - Hospedagem de sites

VAB - Todos os direitos reservados - 2008 / 2012

Developed by: MX Web Studio

Mais em Ajax (17 of 30 articles)