Terça-feira, 26 de Janeiro de 2010

SAPO

Este post pretende dar uma pequena introdução ao uso da LibSAPO.js e aos seus componentes mais básicos.

A LibSAPO.js tem como dependência principal o objecto SAPO.

Deste objecto dependem todas as outras classes utilitárias e widgets do SAPO. Assim, para a utilização de qualquer outra classe, será necessário incluir o ficheiro https://js.sapo.pt/SAPO/

Este é um ficheiro muito pequeno que apenas trata da inicialização da lib e inclui alguns utilitários básicos necessários para o uso da lib.

O objecto SAPO e o método s$, que é um alias para o método document.getElementById são as únicas variáveis globais declaradas pela LibSAPO.js. Mesmo assim, apesar não "poluirmos" o DOM, disponibilizamos mais dois métodos, como extensão do objecto Function:

bindObj() e bindObjEvent()

Para quem está familiarizado com o Prototype, estes métodos são semelhates ao bind() e ao bindAsEventListener().

Sem a adição de quaisquer módulos, o objecto SAPO fornece os seguintes métodos:

SAPO.namespace() - cria o namespace no objecto "SAPO"

SAPO.Browser - Objecto que nos dá a informação do browser. Deve apenas ser usado em casos muito específicos, pois não é boa prática detectar funcionalidades pela designação do browser, mas sim pela detecção da funcionalidade.

As propriedades que podemos encontrar são:

  • SAPO.Browser.IE - (true/false)
  • SAPO.Browser.GECKO - (true/false)
  • SAPO.Browser.OPERA - (true/false)
  • SAPO.Browser.SAFARI - (true/false)
  • SAPO.Browser.KONQUEROR - (true/false)
  • SAPO.Browser.model - modelo do browser (firefox, camino, etc)
  • SAPO.Browser.version - versão do modelo
  • SAPO.Browser.userAgent - "user agent", mesmo que navigator.userAgent
tags:
publicado por suskind às 09:26
link | comentar | favorito
Sexta-feira, 25 de Julho de 2008

SAPO.Widget.SimpleSlide ou Carrossel Simples

Novo widget na LibSAPO.js :-) É apenas um simples carrossel. Tem várias opções, mas este é apenas um exemplo duma implementação simples.
 

A documentação está neste link.

A source aqui.

E o sample aqui.

Exemplo: 

--------------------------------------


 

Code:

-------------------------------

 


<!--- 
SimpleSlide
-->

<div id="sapo_widget_simpleslide" style="position:relative;"></div>

<script type="text/javascript">

// Food for Carrossel
var rawData = [ 
    {   
        url: 'http%3A%2F%2Fjs.sapo.pt%2F',
        img: 'https://js.sapo.pt/Assets/Images/SimpleSlide/Sample01.png',
        title: 'SAPO::Widget.SimpleSlide - 1' 
    },
    { 
        url: 'http%3A%2F%2Fjs.sapo.pt%2F',
        img: 'https://js.sapo.pt/Assets/Images/SimpleSlide/Sample02.png',
        title: 'SAPO::Widget.SimpleSlide - 2' 
    },
    { 
        url: 'http%3A%2F%2Fjs.sapo.pt%2F',
        img: 'https://js.sapo.pt/Assets/Images/SimpleSlide/Sample03.png',
        title: 'SAPO::Widget.SimpleSlide - 3' 
    }
]; 

new SAPO.Widget.SimpleSlide({ 
        target: 'sapo_widget_simpleslide',
        id: 'sapo_widget_simpleslide_sample',
        delay: 6,
        width: '480px',
        height: '211px',
        data: rawData,
        play:false
    });

</script>

publicado por suskind às 15:21
link | comentar | ver comentários (1) | favorito

.mais sobre mim

.pesquisar

.Outubro 2010

Dom
Seg
Ter
Qua
Qui
Sex
Sab
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31

.posts recentes

. SAPO

. SAPO.Widget.SimpleSlide o...

.arquivos

. Outubro 2010

. Junho 2010

. Janeiro 2010

. Julho 2009

. Junho 2009

. Abril 2009

. Março 2009

. Fevereiro 2009

. Julho 2008

. Junho 2008

.tags

. todas as tags

blogs SAPO

.subscrever feeds

Em destaque no SAPO Blogs
pub