visualforce + jquery

Question

Estou tentando implementar um plugin de galeria jquery em um site force.com.Carreguei um arquivo zip contendo todos os arquivos necessários como um recurso estático.

Estou referenciando as folhas de estilo e javascript conforme abaixo:

<apex:includeScript value="{!URLFOR($Resource.jqueryadgallery, 'jquerygallery/jquery.ad-gallery.js')}" />
<apex:stylesheet value="{!URLFOR($Resource.jqueryadgallery, 'jquerygallery/jquery.ad-gallery.css')}"/>

Isso funciona e estou obtendo o CSS associado ao plugin (confira aqui - http://coffeescripter.com/code/ad-gallery/).Mas a única parte que funciona é que as miniaturas das imagens são exibidas com a borda da imagem definida no arquivo CSS.Você pode ver o que eu fiz aqui - http://fusedev-developer-edition.ap1.force.com/ImageDemo.Segui a documentação, mas parece-me que o JavaScript não está funcionando.

Qualquer ajuda apreciada, aplausos

Answer 1

Aqui estão algumas coisas para verificar:

• Salesforce usa protótipo.js, que assim como jQuery, usa a variável global $.É sempre melhor fazer algo como $j = jQuery.noConflict(); na parte superior do seu script para evitar que o jQuery destrua o protótipo.Você também precisará alterar todo o seu javascript para usar $j em vez de $ para coisas jQuery.

• Parece que o script do plugin jquery está sendo carregado antes do próprio jQuery.Certifique-se de que seu primeiro apex:includeScript carrega jQuery.

• Meu navegador está relatando um erro de sintaxe na sua página VF:

Answer 2

<apex:includeScript value="{!URLFOR($Resource.jquery, '/jquery/external/jquery/jquery.js')}"/>
<apex:includeScript value="{!URLFOR($Resource.jquery, '/jquery/jquery-ui.min.js')}"/>

<script>
    j$ = jQuery.noConflict();
    if(j$){
        alert('Success');
    }else{
        alert('Failure');
    }
</script>