I created a random joke generator, and upon clicking the question mark there is a chance that a stick man will appear. The problem is, because there are 12 of them and they’re positioned absolutely, sometimes they were interfering with other elements when they would appear, so I had to write a bunch of media queries to position them for all screen widths and heights. It also works perfectly on mobile, both in portrait and landscape. If I turn on their displays and start resizing the screen they all behave as expected, changing in size and changing positions, but if one of them appears after clicking ? , the media queries work until a certain point, but for example (max-height: 189px) has no effect at that point, and that’s when I need them to disappear. I tried setting display: none !important and it worked, however that affected portrait orientation on mobile too and they were not appearing. You can test it yourself (I recommend clicking on the flag next to US as it has only question-answer jokes). I set background-color to beige at height 189px for your convenience so you can see it has no effect on display after the ? has been clicked. I just don’t see what could possibly be overwriting these queries. https://codepen.io/Montinyek/pen/OJverxX
this is 750 lines of code(just in JS), so I need to ask, where is event listeners for this ? button
and also: is there any way to go to to full page view on codepen, and use google dev tools to analyze your code.
Because when I am opening dev tools there, it’s showing me info all about this codepen stuff, not about your code
And also, this look like a lot of work, that’s kinda impressive
Sorry for the late reply, here’s the event listener for that
document.querySelector('.reveal').addEventListener('click', () => {
memes()
document.querySelector('.answer').style.visibility = 'visible'
document.querySelector('.reveal').style.visibility = 'hidden'
})
Also, I already fixed the issue, you can check it out here https://codepen.io/Montinyek/pen/WNzqZZa
It looks better on mobile in my opinion xD
Надеюсь шутки понравились )))
Шутки в порядке, понравилось))
If it works - it’s cool.
I will play around responsivity of it little later, maybe will share my opinion about it
I am kinda interested in this project of yours because here is multi-language stuff going on.
Have you done any research about practices for creating multi-language pages when building that? Or you came up with implementation on your own?
I am asking because I am considering to build two-language resume and portfolio, so if you have hint or two about that, would be cool.
Cool 
I just speak 9 languages, and I used 7 of them in this project, so I actually understand all of those jokes and picked them all myself xD
Well, that’s incredible!
However, my question was about logic and implementation of switching between languages, not about content. I hope this clarification makes sense.
Oh, that part is simple. There are event listeners that switch languages. I use innerHTML = to change content
Ok, I get it thanks.
For some reason I was imagining that it is somewhat complex.
This topic was automatically closed 182 days after the last reply. New replies are no longer allowed.