<-- Back

Garden Bed

This is my garden bed! I planted a wildflower mix and then allowed any other native plants to grow that popped up. You can learn more about each plant by clicking on it. Please don't take the information too seriously though, I mostly just wanted to do the being able to click on plants thing and then my brain made me finish it.

my garden Yucca Yucca Wood Sorrel Prostrate Spurge Prostrate Spurge Cosmos Zinnia Burnweed Daylily Daylily

Goals for this project:

  • Take a picture of my garden bed.
  • Allow the user to click on specific plants to learn more.
  • When the user hovers over a clickable area, it should be highlighted with a border.
  • If a plant is in two different areas, they should both be highlighted if one is hovered over. This requires javascript and I haven't learned enough javascript yet.

    • I intended to use html maps for this project because they seemed cool, but I learned that for my use case svg would work better. So I got to learn a bit about svg graphics instead!