# Parallax with my example portfolio webpage

**URL:** <https://forum.freecodecamp.org/t/parallax-with-my-example-portfolio-webpage/168390>\
**Category:** I Built This\
**Created:** [January 12, 2018, 9:16pm UTC](https://forum.freecodecamp.org/t/parallax-with-my-example-portfolio-webpage/168390 "2018-01-12T21:16:10Z")\
**Posts on this page:** 6\
**Page:** 1

<div class="post-metadata">

**Author:** ![reneestrasburg](https://sea3.discourse-cdn.com/freecodecamp/user_avatar/forum.freecodecamp.org/reneestrasburg/32/74442_2.png) [@reneestrasburg](https://forum.freecodecamp.org/u/reneestrasburg)\
**Post date:** [January 12, 2018, 9:16pm UTC](https://forum.freecodecamp.org/t/parallax-with-my-example-portfolio-webpage/168390/1 "2018-01-12T21:16:10Z")

</div>

I just finished my personal portfolio webpage. And although there isn’t much about myself in the webpage I was just trying to get some things figured out. I know the page isn’t pretty, but any tips you guys may have would be great! Thanks in advance 🙂

> **[Small Bizz](https://codepen.io/reneestrasburg/full/xpPjWY)**
>
> ...

---

<div class="post-metadata">

**Author:** ![nutanBhakuni](https://sea3.discourse-cdn.com/freecodecamp/user_avatar/forum.freecodecamp.org/nutanbhakuni/32/76177_2.png) [@nutanBhakuni](https://forum.freecodecamp.org/u/nutanBhakuni)\
**Post date:** [January 13, 2018, 1:46pm UTC](https://forum.freecodecamp.org/t/parallax-with-my-example-portfolio-webpage/168390/2 "2018-01-13T13:46:28Z")

</div>

If you want inspiration or want to improve your personal portfolio page, then, you can look at the portfolios of professional developers. Following are some links:

- [https://medium.com/@pedchenko/10-web-developer-portfolios-41a9ebee91f2](https://medium.com/@pedchenko/10-web-developer-portfolios-41a9ebee91f2)
- [https://roybarber.com/](https://roybarber.com/)  
And there is always google.😀

---

<div class="post-metadata">

**Author:** ![ped4enko](https://sea3.discourse-cdn.com/freecodecamp/user_avatar/forum.freecodecamp.org/ped4enko/32/160689_2.png) [@ped4enko](https://forum.freecodecamp.org/u/ped4enko)\
**Post date:** [January 26, 2018, 10:09am UTC](https://forum.freecodecamp.org/t/parallax-with-my-example-portfolio-webpage/168390/3 "2018-01-26T10:09:42Z")

</div>

> [@nutanBhakuni](#):
>
> [https://medium.com/@pedchenko/10-web-developer-portfolios-41a9ebee91f2](https://medium.com/@pedchenko/10-web-developer-portfolios-41a9ebee91f2)

Thanks for the recommendation. But this link is old, visit [new](https://outsourceit.today/web-developer-portfolios/)

> [@reneestrasburg](#):
>
> any tips you guys may have would be great!

The implementation of the parallax effect is good, but I have tips on content content. I’m sure that this is not the latest version and you will finalize your project. Good luck!

 ![](https://global.discourse-cdn.com/freecodecamp/original/3X/2/5/25cad218b52b6d5cd48a6211deb834be1376949c.jpg)

---

<div class="post-metadata">

**Author:** ![stefalber](https://sea3.discourse-cdn.com/freecodecamp/user_avatar/forum.freecodecamp.org/stefalber/32/73054_2.png) [@stefalber](https://forum.freecodecamp.org/u/stefalber)\
**Post date:** [January 27, 2018, 5:29pm UTC](https://forum.freecodecamp.org/t/parallax-with-my-example-portfolio-webpage/168390/4 "2018-01-27T17:29:34Z")

</div>

> [@nutanBhakuni](#):
>
> - [https://roybarber.com/](https://roybarber.com/)

That “fadeIn” is with javascript or with some library/framework?

---

<div class="post-metadata">

**Author:** ![stefalber](https://sea3.discourse-cdn.com/freecodecamp/user_avatar/forum.freecodecamp.org/stefalber/32/73054_2.png) [@stefalber](https://forum.freecodecamp.org/u/stefalber)\
**Post date:** [January 27, 2018, 5:34pm UTC](https://forum.freecodecamp.org/t/parallax-with-my-example-portfolio-webpage/168390/5 "2018-01-27T17:34:44Z")

</div>

When you change something with `:hover` pseudo-class add `transition: all .2s;` in the main class to add a nice effect.  
In your Portfolio it’s good here:

```auto
.topnav a {
    transition: all .2s;
}

```

---

<div class="post-metadata">

**Author:** ![ILM](https://sea3.discourse-cdn.com/freecodecamp/user_avatar/forum.freecodecamp.org/ilm/32/363239_2.png) [@ILM](https://forum.freecodecamp.org/u/ILM)\
**Post date:** [June 1, 2021, 1:56pm UTC](https://forum.freecodecamp.org/t/parallax-with-my-example-portfolio-webpage/168390/6 "2021-06-01T13:56:06Z")

</div>

Closed on June 1, 2021, 1:56pm UTC