Intégrer l'URL actuelle dans un content en CSS

Bohemito Messages postés 64 Date d'inscription   Statut Membre Dernière intervention   -  
Bohemito Messages postés 64 Date d'inscription   Statut Membre Dernière intervention   -

Bonjour,

J'ai ce code et j'aimerais dans la partie "content" placer l'url de la page actuellement ouverte, là où se trouve le code CSS.

Merci beaucoup

Voici le fameux code :

body::before {  
  content: "là où j'aimerais avoir l'URL du site où se trouve ce code";
  align-items: center;
  font-size: 0.8vw;
  color: rgba(255, 255, 255, 0.9);
  position: fixed;
  z-index: 9999;
  border-radius: 4px;
  padding: 10px 20px 15px;
  top: 15%;
  left: 8%;
  height: 13vw;
  margin-right: -50%;
  transform: translate(-50%, -50%);
}

2 réponses

jordane45 Messages postés 38486 Date d'inscription   Statut Modérateur Dernière intervention   4 752
 

Bonjour,

En jouant avec un data-attribute c'est facile: 

par exemple

<div id="test" data-content="test1"></div>
<button id="changecontent">changer</button>

<script>
  document.querySelector('#changecontent').addEventListener('click',function(){
    document.querySelector('#test').setAttribute('data-content',window.location.href);
  });
</script>

0
Bohemito Messages postés 64 Date d'inscription   Statut Membre Dernière intervention   1
 

Bonjour Jordane,

Merci pour ta réponse :)

Cependant, je pense que j'ai oublié de préciser que je ne peux qu'utiliser du CSS, car je veux mettre ce script dans l'extension de Google Chrome "Stylus".

Le but final est d'afficher un message sur chaque site avec leur URL respectif, cela me permet de voir quel site j'utilise pour mes streams même en plein écran.

Cordialement,

Bohemito

0
jordane45 Messages postés 38486 Date d'inscription   Statut Modérateur Dernière intervention   4 752
 

que en css .. je ne pense pas que ça soit possible.  ( à vérifier )

Bonne soirée.

0
Bohemito Messages postés 64 Date d'inscription   Statut Membre Dernière intervention   1 > jordane45 Messages postés 38486 Date d'inscription   Statut Modérateur Dernière intervention  
 

Ah mince, bon dans ce cas cela va être difficile, à moins que je puisse utiliser une extension qui prend en compte l'HTML aussi, merci en tout cas

Bonne soirée

0