0

For example, I pick a Photo and have the index of this photo from array. Now I need to put this index ( key) in Content Css. It must be alive if I get. And yes I named my photos 0 1 2 3. So pls help if you have more advance. thx





const images = ['img1', 'img2', 'img3', 'img4', ];
const photoOut = document.querySelector('.photos');
for (let key in images) {
  let img = document.createElement('img');
  img.setAttribute('data-key', key);
  img.src = 'img/' + key + '.png';
  photoOut.append(img);
}

   let messageAfter = document.querySelector('.message')
photoOut.addEventListener('click', showIndex);
function showIndex(event){
const key = event.target.dataset['key'];
console.log(key);

photoOut.addEventListener('click', function (changeIndex) {
    changeIndex.target.setAttribute('data-after', '3');
});
if (key === undefined) {
    return true;
}

}
```


```
.message:after {
  content: attr(data-after);
  background-color: #FFC200;
  position: absolute;
  display: block;
  width: 25px;
  height: 25px;
  border-radius: 15px;
  color: black;
  right: -20px;
  top: 0;
  text-align: center;
  line-height: 25px;
  font-size: 13px;
  font-weight: bold;
}
```


```
<div class="left-block-menu">
  <p class="gauzy">MENU</p><br>
  <p>Home</p><br>
  <p>My Tasks</p><br>
  <p class="message">Notifications</p><br>
</div>
```
Dis pi s
  • 3
  • 2
  • take a look at this link https://stackoverflow.com/questions/10495243/how-change-content-value-of-pseudo-before-element-by-javascript – parichehr.mohebbi Oct 23 '21 at 08:44
  • Yes I already visited this link before asking here. But maybe my logic is not so power I couldn`t make it(( – Dis pi s Oct 23 '21 at 08:52

0 Answers0