# 👀 Sneak Peek: Random Name Picker with Animation!

**URL:** https://community.glideapps.com/t/sneak-peek-random-name-picker-with-animation/17403
**Category:** Project Showcase
**Created:** [October 21, 2020, 7:47am UTC](https://community.glideapps.com/t/sneak-peek-random-name-picker-with-animation/17403 "2020-10-21T07:47:12Z")
**Posts on this page:** 9
**Page:** 1

<div class="post-metadata">

### Author: ![Robert\_Petitto](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/robert_petitto/32/25193_2.png) [@Robert\_Petitto](https://community.glideapps.com/u/Robert_Petitto)
#### Post date: [October 21, 2020, 7:47am UTC](https://community.glideapps.com/t/sneak-peek-random-name-picker-with-animation/17403/1 "2020-10-21T07:47:12Z")

</div>

### …template and tutorial coming soon 🙂

---

<div class="post-metadata">

### Author: ![Rosewebstudio](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/rosewebstudio/32/12261_2.png) [@Rosewebstudio](https://community.glideapps.com/u/Rosewebstudio)
#### Post date: [October 21, 2020, 8:17am UTC](https://community.glideapps.com/t/sneak-peek-random-name-picker-with-animation/17403/2 "2020-10-21T08:17:49Z")

</div>

Wizardry 👍

---

<div class="post-metadata">

### Author: ![ThinhDinh](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/thinhdinh/32/49_2.png) [@ThinhDinh](https://community.glideapps.com/u/ThinhDinh)
#### Post date: [October 21, 2020, 8:34am UTC](https://community.glideapps.com/t/sneak-peek-random-name-picker-with-animation/17403/3 "2020-10-21T08:34:37Z")

</div>

Gorgeous.

---

<div class="post-metadata">

### Author: ![Robert\_Petitto](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/robert_petitto/32/25193_2.png) [@Robert\_Petitto](https://community.glideapps.com/u/Robert_Petitto)
#### Post date: [October 21, 2020, 3:14pm UTC](https://community.glideapps.com/t/sneak-peek-random-name-picker-with-animation/17403/4 "2020-10-21T15:14:10Z")

</div>

Explanation:

```auto
<pre><span><style>
[data-test="app-image-carousel"] :nth-child(1)
 {
position: fixed;
top:22%;
z-index: 1;
-moz-animation: cssAnimation 0s ease-in 2s forwards;
    /* Firefox */
    -webkit-animation: cssAnimation 0s ease-in 2s forwards;
    /* Safari and Chrome */
    -o-animation: cssAnimation 0s ease-in 2s forwards;
    /* Opera */
    animation: cssAnimation 0s ease-in 2s forwards;
    -webkit-animation-fill-mode: forwards;
    animation-fill-mode: forwards;
}
@keyframes cssAnimation {
    to {
        width:0;
        height:0;
        overflow:hidden;
    }
}
@-webkit-keyframes cssAnimation {
    to {
        width:0;
        height:0;
        visibility:hidden;
    }
}

```

---

<div class="post-metadata">

### Author: ![Robert\_Petitto](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/robert_petitto/32/25193_2.png) [@Robert\_Petitto](https://community.glideapps.com/u/Robert_Petitto)
#### Post date: [October 21, 2020, 6:26pm UTC](https://community.glideapps.com/t/sneak-peek-random-name-picker-with-animation/17403/5 "2020-10-21T18:26:47Z")

</div>

Template now available!

> **[Random Name Picker](https://go.glideapps.com/app/YU9UJnYPl7KOoePNxPfI-template)**
>
> A fun and lightweight app that allows you to create lists of names and select them at random. Nice for chore assignment or classroom use!

---

<div class="post-metadata">

### Author: ![Wiz.Wazeer](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/wiz.wazeer/32/72423_2.png) [@Wiz.Wazeer](https://community.glideapps.com/u/Wiz.Wazeer)
#### Post date: [October 22, 2020, 5:28am UTC](https://community.glideapps.com/t/sneak-peek-random-name-picker-with-animation/17403/6 "2020-10-22T05:28:03Z")

</div>

Kids are gonna love this !

---

<div class="post-metadata">

### Author: ![wjcv06](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/wjcv06/32/12747_2.png) [@wjcv06](https://community.glideapps.com/u/wjcv06)
#### Post date: [October 23, 2020, 7:46pm UTC](https://community.glideapps.com/t/sneak-peek-random-name-picker-with-animation/17403/7 "2020-10-23T19:46:40Z")

</div>

It seems that Glide changed the name of its classes, because a couple of days ago it worked and now it doesn’t

---

<div class="post-metadata">

### Author: ![Robert\_Petitto](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/robert_petitto/32/25193_2.png) [@Robert\_Petitto](https://community.glideapps.com/u/Robert_Petitto)
#### Post date: [October 23, 2020, 7:57pm UTC](https://community.glideapps.com/t/sneak-peek-random-name-picker-with-animation/17403/8 "2020-10-23T19:57:15Z")

</div>

I’ll take a look and update the code tonight.

---

<div class="post-metadata">

### Author: ![Robert\_Petitto](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/robert_petitto/32/25193_2.png) [@Robert\_Petitto](https://community.glideapps.com/u/Robert_Petitto)
#### Post date: [October 23, 2020, 10:45pm UTC](https://community.glideapps.com/t/sneak-peek-random-name-picker-with-animation/17403/9 "2020-10-23T22:45:57Z")

</div>

Edited the code above. It’s not perfect…gotta play with the top% a bit. I also added a separator above the image:

 ![image](https://us1.discourse-cdn.com/flex002/uploads/glideapps/original/2X/7/7a70a3477f081b4b174065ffc16d9d5d05370b98.png)