Frontend Web Development

cross-posted from: https://programming.dev/post/18448206

Hi,

I would like to use a rectangle that move (left to right) to reveal an element / image

like this

The white box shall be the image to display

But I'm already block at my svg animation

<svg viewBox="0 0 265.135 68.642" xmlns="http://www.w3.org/2000/svg">
<g x="-55.790085" y="0.79151762">
    <rect
       style="fill:#ffcc00;stroke-width:2.46513;stroke-linecap:round;stroke-linejoin:round;paint-order:stroke fill markers;stop-color:#000000"
       width="55.465603"
       height="151.60599"       
       transform="rotate(45)" />
       <animate
      attributeName="x"
      values="-55.790085;265"
      dur="5s"
      repeatCount="indefinite" />
  </g>
</svg>

Because the rectangle is not moving :'(

Any ideas ?

Thanks.

Get injee here https://yu7.in/injee

cross-posted from: https://lemmy.ml/post/17900124

Hi,

I'm looking for some inspiration to create a website.

Do you have a "crush" :) for a website (design speaking)

Or do you know some website that list great visual feature or website ?

Thanks.

Hi there,

I have written an article on implementing server-side caching that ensures your app stays fast as you scale.

I’ve used ExpressJS for the API server, and React for the frontend.

Hope this helps someone!

When we are creating a website or blog it is always important to have a contact area, an area where our visitors can give feedback on how their experience on the site is going. Below is a simple code on how to do this.

Something such as !webdev@programming.dev

Interesting stuff to come.

Play around on https://oklch.com Chrome on a Mac screen e.g. supports P3.

Adding the same id multiple times increases the specificity of a selector and thus overrides other selectors.

e.g.

#myId span {color: red; }
#myId#myId#myId span { color: blue; }

Codepen

https://caniuse.com/css-has

I started learning web development with it. And I really enjoy the format so far. Have you ever tried to learn web dev online?