justfrast
justfrast
PostsComments
KPCKevin Powell - Community
Created by justfrast on 8/4/2024 in #front-end
Media Query Not Working
Hi, I have a custom cursor that I would like to disable for mobile devices. However, the media query display: none that I'm applying dosen't seem to work. 
<div class="media">
    <div class="cursor"></div>
  </div>
<div class="media">
    <div class="cursor"></div>
  </div>
@media (min-height: 420px)
  {
    .media {
      display: none;
    }
  }

.cursor {
  display: block;
  width: 20px;
  height: 20px;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%);
  border-radius: 90%;
  pointer-events: none;
  z-index: 111;
  border: 3px solid white;
  background: white;
  transition: all 0.2s ease-out;
  animation: moveCursor1 .5s infinite alternate;
  mix-blend-mode: difference;
  }

.expand {
  background: #FF004D;
  animation: moveCursor2 .3s forwards;
  border: 1px solid #FF004D;
}
@media (min-height: 420px)
  {
    .media {
      display: none;
    }
  }

.cursor {
  display: block;
  width: 20px;
  height: 20px;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%);
  border-radius: 90%;
  pointer-events: none;
  z-index: 111;
  border: 3px solid white;
  background: white;
  transition: all 0.2s ease-out;
  animation: moveCursor1 .5s infinite alternate;
  mix-blend-mode: difference;
  }

.expand {
  background: #FF004D;
  animation: moveCursor2 .3s forwards;
  border: 1px solid #FF004D;
}
35 replies
KPCKevin Powell - Community
Created by justfrast on 7/29/2024 in #front-end
Scrolling past loading screen
I've implemented a loading screen while all the gifs in my website is loading but I've found that even while it is loading I am able to scroll past it since it is just covering one section. Is there anything I can do to disable scrolling while it is loading? 
window.addEventListener('wheel', handleScroll);
window.addEventListener('wheel', handleScroll);
13 replies