Jump to content
Search Community

jellevrswk

Members
  • Posts

    4
  • Joined

  • Last visited

Posts posted by jellevrswk

  1. In my last post I was struggeling with getting an on click event work within an svg image. This problem is solved, but now I'm struggeling with getting a hover to work.

     

    Here is what I my code to do:

    When you press one of the buttons, for example $yellowbutton, all the colored blocks except for the $yellowblock will get opacity 0. $yellowblock will get opacity 1. This is the part that is allready working. Now what I want it to do is when a button is pressed and thus a certain colored block is shown, when hovered over this block it enlarges. 

     

    The code I've used to get this to work is based on

    See the Pen qdgNdL by ihatetomatoes (@ihatetomatoes) on CodePen

    . For now, only the orange block is working, but this might be because the orange block is the first visible block in the svg image.

    See the Pen rxVQLE by jellevrswk (@jellevrswk) on CodePen

  2. I need some help with animating certain parts of my svg image when clicked on another part of the svg image. 
     

    This is what I'm trying to do: 

    When you click on one of the smaller buttons, for example the yellowbutton, the yellowblock will appear (with opacity: 1) and the other coloured blocks will dissapear (with opacity: 0). When you click on the orangebutton, the orangebutton will appear and the other coloured blocks will dissapear etc. etc. 

     

    I think I'm on the right track but something isn't working.

    See the Pen rxVQLE?editors=101 by jellevrswk (@jellevrswk) on CodePen

  3. For a school assignment I have to make blinking eyes using GS. I figured that If a make an SVG image with seperate eyelids I could use ScaleY to enlarge the eyelids and give the illusion that they're blinking. But for some reason the lower eyelids are acting strange and moving to different location while they're not told to.

    I hope anyone can tell me what I'm doing wrong and explain what to do.

    See the Pen EVOZom?editors=001 by jellevrswk (@jellevrswk) on CodePen

×
×
  • Create New...