webmaster

Como Criar O Botão More Do Twitter Com JQuery E PHP

Olá, Somos criadores de conteúdo apaixonados por web design, programação, criação de websites e tecnologias digitais. O nosso website está online! Explore a nova versão beta, onde terá acesso a novos recursos e melhorias. A sua experiência e feedback são muito importantes para nós! Novos artigos, todas as semanas! Fique atento.
Artigos SEO

Artigos SEO

Search Engine Optimization

Artigos WordPress

Criação de websites.

Tutoriais

Ensino numa série de passos simples

Como Criar O Botão More Do Twitter Com JQuery E PHP

Outro tutorial fantástico e com estilo para você aprender a criar o botão MORE do Twitter para carregar mais informação, usando PHP e jQuery. Já viu como no Twitter, se carregar no botão MORE, acede a mais informação da base de dados. Eu criei uma aplicação similar com jQuery e PHP.

Criei um script baseado em AJAX para ir buscar registos à base de dados e alguns efeitos de desvanecer para ficar com um visual atrativo. Eu espero que você goste do tutorial. Obrigado!

Veja a DEMO: Como Criar O Botão More Do Twitter Com JQuery E PHP:

Código jQuery


$(document).ready(function(){

//more records show

$('#bottomMoreButton').livequery("click", function(e){

var next = $(this).find('a').attr('id').replace('more_','');
$('#load').html('Loading...');

$.post("posts.php?show_more_post="+next, {

}, function(response){

$('#bottomMoreButton').remove();
$('#posting').append($(response).fadeIn('slow'));
$('#load').html('More');

});

});

});

Eu usei algumas funções simples do jQuery para conseguir o efeito pretendido. E espero que você não tenha qualquer problema a implementar o script.

Arquivo posts.php


0)
{
$show_more_button = 1;
}
}
else
{
$show_more_button = 1;
$result = mysql_query("SELECT * FROM rui_twitter_load_button order by id desc limit 0,5");
}

while ($row = mysql_fetch_array($result))
{?>


Estrutura Da Base De Dados MySQL


CREATE TABLE IF NOT EXISTS `rui_twitter_load_button` (
`id` int(11) NOT NULL AUTO_INCREMENT,
`text` text NOT NULL,
`image` varchar(200) NOT NULL,
PRIMARY KEY (`id`)
)

Código HTML

Twitter Style More Button To Load Records

Download do código usado neste tutorial: Como Criar O Botão More Do Twitter Com JQuery E PHP

1 Star2 Stars3 Stars4 Stars5 Stars (No Ratings Yet)

Deixe o seu comentário, participe!

7 Responses

  1. Olá Zeeshan Rasool,

    bom artigo mais um tutorial para a base de dados.

    Cumprimentos
    Soares

    1. Olá! O Zee é um programador com muito talento. Gosto dos tutoriais deles. Um Abraço! Rui Soares

  2. Bom o exemplo ficou massa…
    mas nao teria como liberar o codigo? esta apenas demonstrando:
    "Download do código usado neste tutorial: Como Criar O Botão More Do Twitter Com JQuery E PHP"
    mas nao possui nenhum link.

    valeu

  3. O código que estar sendo exibido acima não funciona contem alguns erros.
    O script não consegue exibir as informações do banco de dados. Teria como disponibiliza o código para download, agradeço desde já.

  4. Parabéns pelo artigo! Sei que ele já é antigo, mas teria como implementar isto no wordpress?

Leave a Reply

Your email address will not be published. Required fields are marked *


Versão Beta

Estamos a mudar

Olá, Somos criadores de conteúdo apaixonados por web design, programação, criação de websites e tecnologias digitais. Ajudamos os nossos clientes a levar o conteúdo certo às pessoas certas, criando artigos e recursos que facilitam a criação e otimização de websites.

Artigos Populares

Guia Prático Sobre Segurança Do Joomla

Dicas para diminuir substancialmente o número de vetores de ataque ao Joomla! Proteja o seu trabalho!

Os Segredos Do Sucesso Na Internet

A responsabilidade. O querer. O erro e a experimentação. O social. A memória da internet. Ser quem você é.

38 Ideias Espetaculares Para Sites De Empresas

Encontre inspiração nestes 45 exemplos de sites de empresas para criar o site da sua empresa.