Como detectar o tipo de navegador do usuário em css3

Na maioria dos casos, os desenvolvedores não consegue escolher o navegador do usuário. Para determinar se um determinado usuário pode trabalhar com seu aplicativo CSS3, então, você precisa primeiro a detectar o navegador do usuário - e, em seguida, determinar se esse navegador é aceitável.

Criando o código necessário para executar esta tarefa à mão não é impossível, mas pode ser difícil. Artigos como o que a javascripter.net dizer-lhe como executar esta tarefa, mas um olhar para o código deve dizer-lhe que é uma tarefa complexa. (Você pode ver o resultado deste código de exemplo Aqui.)

jQuery faz com que seja possível realizar a detecção com relativa facilidade. O exemplo a seguir mostra um método para detectar o nome ea versão do navegador do usuário. Baseia-se na mais recente 1.X versão do jQuery, que é a versão 1.10.1 no momento da redação deste texto. (Você pode encontrar o código completo para este exemplo na pasta Capítulo 06jQuery do código para download como BrowserDetect.html.)

Detectar um navegador

Informações navegador

Esta é uma página HTML5, por isso começa com a declaração HTML, . Este exemplo começa com uma estrutura de base que inclui o , , , e <body> Tag.</body>

O código começa com o primeiro

Qualquer um que usa o aplicativo terá automaticamente acesso a jQuery, desde que o navegador pode acessar a Internet. (Você também pode baixar uma cópia do jQuery para acesso local a partir do site do jQuery.)

A mais recente 1.X versão do jQuery não suporta o recurso de detecção de navegador diretamente. A fim de tornar o trabalho recurso com qualquer coisa mais recente que a jQuery 1.8.3, você também deve incluir o link para o biblioteca jQuery Migrate como mostrado no exemplo.

o da página começa com uma

tag que contém cabeçalho da página. O próximo passo é fornecer um lugar para jQuery para colocar o nome do browser.

Neste caso, o exemplo usa um

(Parágrafo) tag que tem um id de nome. O primeiro

Video: Resetar a configuração de navegadores. HTML5 e CSS3 aula 12



É hora de exibir o nome na tela. O $ (cifrão) é um símbolo especial que se refere à biblioteca jQuery, que também é chamado de Application Programming Interface (API). O trecho de código que diz: $ ( ‘p [id =” nome”]’). Html, diz jQuery para usar o

tag com um valor id de nome para segurar alguns HTML. Este é um tipo de seletor.

Agora você tem uma tag específica selecionada. O código, em seguida, diz jQuery para criar um texto, uma , e em seguida, coloque o nome do navegador dentro desse período. Toda esta informação aparece no

tag depois que o script é executado.

Em seguida, vem um segundo

tag. Este tem um atributo id de versão. O roteiro acompanha começa a mesma de antes. O $ ( ‘p [id =” versão”]’). Html entrada diz jQuery para colocar um pouco de HTML no

tag com um atributo id de versão. Neste caso, jQuery fornece o que você precisa como uma propriedade. Todo o código tem que fazer é dizer jQuery para colocar o valor em browser.version dentro do

tag para exibir o número da versão do navegador. Quando você executar esse exemplo, você ver uma saída semelhante a esta:

Uma biblioteca pode detectar apenas os navegadores Ele foi projetado para detectar. Consequentemente, jQuery detecta alguns navegadores, mas não outros. Por exemplo, você não pode atualmente usá-lo para detectar um navegador Android porque o Android não está na lista de navegadores suportados pelo jQuery (que se concentra em navegadores de desktop).

Video: Imagem 100% navegador com CSS3

A maioria dos métodos de detecção de navegador dependem de cadeias de agente de utilizador que contêm informações sobre o browser. Para ver a seqüência do agente do usuário para o seu navegador, consulte a Qual é o meu agente do usuário?. Geralmente você pode encontrar listas de cadeias de agente de utilizador para dispositivos online.


Publicações relacionadas