Ir para conteúdo

POWERED BY:

renan mafra

Members
  • Total de itens

    73
  • Registro em

  • Última visita

Reputação

0 Comum

Sobre renan mafra

  1. Eu tenho 2 arquivos CSS externos que contém backgrounds da página. Em 1 só tem links para imagens .webP e em outro somente .PNG , eu estou usando um script para detectar se o browser aceita .webP e caso afirmativo ele altera o link CSS externo em HEAD para o css externo com .webP, por padrão inicialmente ele aponta para o .png, testei numa página mais simples e deu ok, mas na hora de colocar aonde quero não funcionou, segue o código: No HEAD: <link href="‪arquivos_css/png.css" rel="stylesheet" id="key"> No JS: ////////////////////////////////////////////////////////////// // FUNÇÃO QUE CRIA O LINK EXTERNO CSS PARA INSERIR NO HEAD // OK// ////////////////////////////////////////////////////////////// function loadCSS(url){ var link = document.createElement('link'); link.setAttribute('href', url ); link.setAttribute('rel', "stylesheet" ); link.setAttribute('id', "key" ); var para = document.getElementsByTagName('head')[0]; //Nó pai HEAD var velho = document.getElementById('key'); //local exato do elemento a ser substituido para.replaceChild(link, velho); //Substituímos o velho pelo novo(link) } ////////////////////////////// Chamada à função do webP ///////////////////////////// WebpIsSupported(function(isSupported){ if(isSupported){ //CHAMA A FUNÇÃO LOADCSS e carrega o link CSS externo com WEBP loadCSS('arquivos_css/webp.css'); } }); ////////////////////////////////////////////////////////////// // FUNÇÃO QUE DETECTA A COMPATIBILIDADE DO BROWSER COM WEBP // ////////////////////////////////////////////////////////////// function WebpIsSupported(callback){ if(!window.createImageBitmap){ callback(false); return; } var webpdata = 'data:image/webp;base64,UklGRiQAAABXRUJQVlA4IBgAAAAwAQCdASoCAAEAAQAcJaQAA3AA/v3AgAA='; fetch(webpdata).then(function(response){ return response.blob(); }).then(function(blob){ createImageBitmap(blob).then(function(){ callback(true); }, function(){ callback(false); }); }); } O erro que está dando no chrome é esse: Failed to load resource: net::ERR_FILE_NOT_FOUND já mudei na função loadCSS o endreço dos arquivos de loadCSS('arquivos_css/webp.css'); para loadCSS('/arquivos_css/webp.css'); e não funciona.... o arquivo CSS externo contém backgrounds dentro do seletor HTML tipo : html { background-image.....(1); background-image.....(2); background-image.....(3); etc } eu vou no elements do chome e está lá no HEAD conforme quero mas não carrega na página e dá este erro no console. – o que pode estar acontecendo ? ?
×

Informação importante

Ao usar o fórum, você concorda com nossos Termos e condições.