Fóruns sobre PHP, JavaScript, HTML, MySQLi, jQuery, Banco de Dados, CSS


Moderador: web

 
Avatar do usuário
ADMIN
ADMIN
Tópico Autor
Mensagens: 17722
Nome: Kleber
Descrição do site: Onde você encontra scripts grátis para o seu site
Sexo: Masculino
Localização: RJ / RJ / Brasil
Contato:

Como criar opção de select com imagem e texto com jQuery

23-01-2015 10:53

Nesse texto vou indicar um plugin para que você possa adicionar imagens e texto no fundo de uma option de um select.

O plugin ddSlick jQuery é oferecido nesse site http://designwithpc.com/Plugins/ddSlick

Segue abaixo um exemplo de como usar esse plugin

Obs.: A chamada do plugin deve estar no final do seu código, antes do fechamento do body.

<script src="jquery.js"></script>   <script> $(document).ready(function() {   $('#myDropdown').ddslick({ onSelected: function(selectedData){ //callback function: do something with selectedData; } });   }); </script>


<select id="myDropdown"> <option value="0" data-imagesrc="http://dl.dropbox.com/u/40036711/Images/facebook-icon-32.png" data-description="Description with Facebook">Facebook</option> <option value="1" data-imagesrc="http://dl.dropbox.com/u/40036711/Images/twitter-icon-32.png" data-description="Description with Twitter">Twitter</option> <option value="2" selected="selected" data-imagesrc="http://dl.dropbox.com/u/40036711/Images/linkedin-icon-32.png" data-description="Description with LinkedIn">LinkedIn</option> <option value="3" data-imagesrc="http://dl.dropbox.com/u/40036711/Images/foursquare-icon-32.png" data-description="Description with Foursquare">Foursquare</option> </select>


<script type="text/javascript" src="http://dl.dropbox.com/u/40036711/Scripts/jquery.ddslick.min.js"></script>

1
A melhor hospedagem para o seu site HostGator!

Quem está online

Usuários navegando neste fórum: Nenhum usuário registrado