Class sendo adicionada em apenas um elemento do laço de repetição (PHP)
15/02/2019
0
Caros programadores! Entendo muito pouco de Javascript / jquery, meu forte mesmo é Php e Css, é o seguinte, estou desenvolvendo um sistema há um tempinho e nele estava implementando a LAZY LOAD, aquela famosa técnica de carregamento de imagens que só são carregadas quando o usuário rola a página até onde elas estão, optei pela API Intersection Observer, só que algumas versões do IE não a suportam, pensando nisso decidi criar uma verificação para aparecer uma mensagem caso o navegador não suporte, até aqui tudo bem consegui com o seguinte código abaixo:
if ("IntersectionObserver" in window === false){
$("#image-load").append("<p class='p_um no-img'>Seu navegador não suporta a API, atualize a versão ou tente acessar com outro. </p>")
;}
Este código acima cria uma nova Div dentro do container #image-load com a mensagem que queria, (este container #image-load está em um laço de repetição cada imagens que tenho no WHILE também saem com esse container) o problema é que as minhas imagens estão em um Laço de repetição no PHP e o código está apenas funcionando no primeiro elemento do WHILE, quebrei a cabeça e não consegui nada além! Segue abaixo a maneira que está sendo impressa o while no HTML!
<div class="cover-det" id="image-load">
<img data-src="img-1.jpg">
<p class='p_um no-img'>
Seu navegador não suporta a API, atualize a versão ou tente acessar com outro.
</p>
</div>
<div class="cover-det" id="image-load">
<img data-src="img-2.jpg">
</div>
<div class="cover-det" id="image-load">
<img data-src="img-3.jpg">
</div>
e assim vai...
a minha pergunta é a seguinte: Como fazer essa mensagem ser reproduzida em todas as imagens desse meu while no PHP?
AGRADEÇO A COLABORAÇÃO DE TODOS.
if ("IntersectionObserver" in window === false){
$("#image-load").append("<p class='p_um no-img'>Seu navegador não suporta a API, atualize a versão ou tente acessar com outro. </p>")
;}
Este código acima cria uma nova Div dentro do container #image-load com a mensagem que queria, (este container #image-load está em um laço de repetição cada imagens que tenho no WHILE também saem com esse container) o problema é que as minhas imagens estão em um Laço de repetição no PHP e o código está apenas funcionando no primeiro elemento do WHILE, quebrei a cabeça e não consegui nada além! Segue abaixo a maneira que está sendo impressa o while no HTML!
<div class="cover-det" id="image-load">
<img data-src="img-1.jpg">
<p class='p_um no-img'>
Seu navegador não suporta a API, atualize a versão ou tente acessar com outro.
</p>
</div>
<div class="cover-det" id="image-load">
<img data-src="img-2.jpg">
</div>
<div class="cover-det" id="image-load">
<img data-src="img-3.jpg">
</div>
e assim vai...
a minha pergunta é a seguinte: Como fazer essa mensagem ser reproduzida em todas as imagens desse meu while no PHP?
AGRADEÇO A COLABORAÇÃO DE TODOS.
Caio Lourençon
Curtir tópico
+ 0
Responder
Clique aqui para fazer login e interagir na Comunidade :)