Where communities thrive


  • Join over 1.5M+ people
  • Join over 100K+ communities
  • Free without limits
  • Create your own community
People
Activity
  • Aug 17 09:32
    User @bjorno43 unbanned @linkin-park
  • Jun 20 21:19
    @bjorno43 banned @shenerd140
  • Apr 25 17:13
    @mstellaluna banned @cmal
  • Jan 08 22:05
    @mstellaluna banned @dertiuss323
  • Nov 07 2018 04:42
    User @texas2010 unbanned @ows-ali
  • Nov 02 2018 16:25
    @texas2010 banned @ows-ali
  • Oct 12 2018 05:50
    @bjorno43 banned @NACH74
  • Oct 05 2018 23:02
    @mstellaluna banned @JomoPipi
  • Sep 16 2018 12:21
    @bjorno43 banned @yash-kedia
  • Sep 16 2018 12:16
    @bjorno43 banned @vnikifirov
  • Sep 05 2018 08:12
    User @bjorno43 unbanned @androuino
  • Sep 05 2018 07:38
    @bjorno43 banned @androuino
  • Aug 23 2018 16:57
    User @bjorno43 unbanned @rahuldkjain
  • Aug 23 2018 16:23
    @bjorno43 banned @rahuldkjain
  • Jul 29 2018 14:13
    User @bjorno43 unbanned @jkyereh
  • Jul 29 2018 01:00
    @bjorno43 banned @jkyereh
  • Jul 10 2018 22:09
    @bjorno43 banned @manafn
  • Jul 06 2018 15:20
    @texas2010 banned @imlegend19
  • Jul 03 2018 12:28
    @bjorno43 banned @vbvmatta
  • Jun 29 2018 13:54
    @bjorno43 banned @OGTechnoBoy
Gulsvi
@gulsvi
@DarkxPunk On Saturdays, you just post to that subreddit with [Showoff Saturday] in the post title. For example: https://www.reddit.com/r/webdev/comments/83ifyx/showoff_saturday_personal_site_thoughts/
DarkxPunk
@DarkxPunk
Gotcha, thanks @gulsvi
CamperBot
@camperbot
darkxpunk sends brownie points to @gulsvi :sparkles: :thumbsup: :sparkles:
:star2: 2672 | @gulsvi |http://www.freecodecamp.org/gulsvi
Mark Kubik
@KUBIX90
Hi Cananyone help with my animation when i click on the quote machine box?
it seems to have a mind of its own and I'm not sure why it doesn't work properly every time I click on it. It's suppose to work when I click the box and then when I click the cross to get rid of it
DarkxPunk
@DarkxPunk
Nothing happens for me in the snippet here, let me load it up.
Yeah nothing is happening for me even in browser...
Mark Kubik
@KUBIX90
no modal showing up when you click on the quote button?
quote machine box i mean
DarkxPunk
@DarkxPunk
Nothing happens at all no matter what or where I click.
Mark Kubik
@KUBIX90
oh, err I'm not sure what the reason is, it's coming up fine on my screen
DarkxPunk
@DarkxPunk
What browser you using, what os?
Mark Kubik
@KUBIX90
firefox, windows
just tried it on chrome and its OK as well
DarkxPunk
@DarkxPunk
Seems to be an issue with Safari
May be something to address, works in FF and Chrome yes.
It seems to work in FF/Chrome without issue for me, cant replicate...
Mark Kubik
@KUBIX90
yeah I'll look into that one, not sure what the cause could be atm, not using any frameworks, just a bit of CSS grid for the portfolio bit
DarkxPunk
@DarkxPunk
I cant this moment but if I get a chance I will rebuild it so it works in safari and forward it to you.
Stephen James
@sjames1958gm
@KUBIX90 Is it supposed to slide up off the screen everytime?
Mark Kubik
@KUBIX90
yeah and slide down when I click the quote machine box
Stephen James
@sjames1958gm
@KUBIX90 I am on Mac chrome - it just appears each time, and only slides up the first time
Mark Kubik
@KUBIX90
Yeah I'm unsure as to why its not doing it, like I said, it seems to have mind of its own and its scrambled my brain a bit
Seems fairly simple on paper but I seem to have made a mess of it, its the showModal keyframe
and the removeModal keyframe
@sjames1958gm
Stephen James
@sjames1958gm
@KUBIX90 I dont see showModal animation on the click
Mark Kubik
@KUBIX90
should be line 268 in the css
I've not put it in the JS for some reason, is that the issue?
Gulsvi
@gulsvi
@KUBIX90 I think you need to clear the styles you set after dismissing the modal dialog to reset it back to default
Might be easier to add/remove a class rather than setting inline styles
To get it working on Safari, you might want to use an autoprefixer https://github.com/postcss/autoprefixer
Mark Kubik
@KUBIX90
@gulsvi I tried using a class but couldn't get it working
Stephen James
@sjames1958gm
@KUBIX90 Isn't that CSS Only going to happen on page load? (line 268) that is
@KUBIX90 I removed showModal from CSS and then added
document.querySelector(".modal-content").style.animation = "showModal 1s";
to the over click event and it seems to work
Mark Kubik
@KUBIX90
@sjames1958gm Yeah i think that's the problem, I've added it to the JS and it seems to be working as intended
Stephen James
@sjames1958gm
@KUBIX90 :+1:
Mark Kubik
@KUBIX90
the animation that is not the above haha
document.querySelector(".container_portfolio-image--overlay").addEventListener("click", function(){
    document.querySelector(".modal-content").style.animation = "showModal 1s";
    document.querySelector(".modal").style.opacity = "1";    
    document.querySelector(".modal").style.visibility = "visible";
})
Stephen James
@sjames1958gm
@KUBIX90 yep
Mark Kubik
@KUBIX90
@sjames1958gm Is it especially frowned upon to do it like this? I'm very wary of using inline CSS but A) it works this way and B) it only appears when clicking and isn't in the actual html file to begin with
Stephen James
@sjames1958gm
@KUBIX90 You could put this in a class and add class and remove class, but I think this is ok. I think that you have to judge for yourself when this gets unwieldy and you need to use a class
Mark Kubik
@KUBIX90
I've been very preoccupied with my syntax/best practices when doing these projects so far in a bid to make them at least somewhat professional
I know the JS looks a bit naff atm, but I will change it and just wanted to get it working right now
Stephen James
@sjames1958gm
@KUBIX90 IMO if behavior is in JS, sometimes it is easier to reason about than css
Mark Kubik
@KUBIX90
@gulsvi @sjames1958gm Thanks for your help both of you anyhow
CamperBot
@camperbot
kubix90 sends brownie points to @gulsvi and @sjames1958gm :sparkles: :thumbsup: :sparkles:
:star2: 2673 | @gulsvi |http://www.freecodecamp.org/gulsvi