Help me. A tooltip with div is not being visible whatsoever

JavaScript
1

Tell us what’s happening:

my tooltip is not visible whatsoever. I have tried every outcome visible to me. Nothing works. Some solutions make the problem worse and some give a complete different error.

link to my project is:

Your code so far

  .on('mouseenter', (d, i) => {
    
      tooltip.classList.add('toolbar');
      tooltip.style.left = i * barWidth + padding * 2 + 'px';
      tooltip.style.top = h - padding * 4 + 'px';
      tooltip.setAttribute('data-date', d[0])
      console.log(tooltip);
      tooltip.innerHTML = `
        <small>${d[0]}</small>
        $${d[1]} billions
      `;
  }).on('mouseout', () => {
     tooltip.classList.remove('toolbar');
    console.log(tooltip);
  });

Your browser information:

User Agent is: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/84.0.4147.105 Safari/537.36.

Challenge: Visualize Data with a Bar Chart

Link to the challenge:

2

The link to your project didn’t quite come through, please post it again. Without being able to see all of your code it is hard to know what the issue is here.

tooltip.style.left = i * barWidth + padding * 2 + 'px';
tooltip.style.top = h - padding * 4 + 'px';

These two lines stand out to me. Just making sure you understand which operators take precedence here.

1 Like
3

Hey @krishnasai3cks,

nice to meet you.

Your code seems to be incomplete
and you didn’t provide a link to a code project.

Please edit your original post and add some code or a link to a project :slightly_smiling_face:

1 Like
4

I have edited the post and added the link now. Sorry for not including the link before itself.