OiO.lk Community platform!

Oio.lk is an excellent forum for developers, providing a wide range of resources, discussions, and support for those in the developer community. Join oio.lk today to connect with like-minded professionals, share insights, and stay updated on the latest trends and technologies in the development field.
  You need to log in or register to access the solved answers to this problem.
  • You have reached the maximum number of guest views allowed
  • Please register below to remove this limitation

How do I get Tailwind's active breakpoint in JavaScript?

  • Thread starter Thread starter Prakash S
  • Start date Start date
P

Prakash S

Guest
I am building Tailwind with config file and including it in a React project.

I would like to get the active breakpoint value in JavaScript/React. How can I achieve the same?


Code:
 <div class="block  sm:hidden md:hidden lg:hidden xl:hidden">al</div>
  <div class="hidden sm:block  md:hidden lg:hidden xl:hidden">sm</div>
  <div class="hidden sm:hidden md:block  lg:hidden xl:hidden">md</div>
  <div class="hidden sm:hidden md:hidden lg:block  xl:hidden">lg</div>
  <div class="hidden sm:hidden md:hidden lg:hidden xl:block">xl</div>
</div>

The above shows the active breakpoints. But how do I get the same in JS without including any of the above markup?

<p>I am building Tailwind with config file and including it in a React project.</p>
<p>I would like to get the active breakpoint value in JavaScript/React. How can I achieve the same?</p>
<p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
<div class="snippet-code">
<pre class="snippet-code-html lang-html prettyprint-override"><code> <div class="block sm:hidden md:hidden lg:hidden xl:hidden">al</div>
<div class="hidden sm:block md:hidden lg:hidden xl:hidden">sm</div>
<div class="hidden sm:hidden md:block lg:hidden xl:hidden">md</div>
<div class="hidden sm:hidden md:hidden lg:block xl:hidden">lg</div>
<div class="hidden sm:hidden md:hidden lg:hidden xl:block">xl</div>
</div></code></pre>
</div>
</div>
</p>
<p>The above shows the active breakpoints. But how do I get the same in JS without including any of the above markup?</p>
 

Latest posts

Online statistics

Members online
0
Guests online
3
Total visitors
3
Ads by Eonads
Top