# How to allow tile collision only to the top?

**URL:** <https://phaser.discourse.group/t/how-to-allow-tile-collision-only-to-the-top/3589>\
**Category:** Phaser 3\
**Created:** [August 27, 2019, 6:19pm UTC](https://phaser.discourse.group/t/how-to-allow-tile-collision-only-to-the-top/3589 "2019-08-27T18:19:26Z")\
**Posts on this page:** 6\
**Page:** 1

<div class="post-metadata">

**Author:** ![JackBruno](https://yyz2.discourse-cdn.com/free1/user_avatar/phaser.discourse.group/jackbruno/32/3459_2.png) [@JackBruno](https://phaser.discourse.group/u/JackBruno)\
**Post date:** [August 27, 2019, 6:19pm UTC](https://phaser.discourse.group/t/how-to-allow-tile-collision-only-to-the-top/3589/1 "2019-08-27T18:19:26Z")

</div>

What I wanted to achieve here is, I want the sprite to overlap tiles and only collide when the sprite is on top of tiles.

![](https://global.discourse-cdn.com/free1/uploads/phaser1/original/2X/1/133ebd7764897022aa3e54851f881f2fc1acef43.png)

I can’t find a tutorial for this kind of stuff, so I am asking you all to aid and enlighten me.

---

<div class="post-metadata">

**Author:** ![yannick](https://yyz2.discourse-cdn.com/free1/user_avatar/phaser.discourse.group/yannick/32/732_2.png) [@yannick](https://phaser.discourse.group/u/yannick)\
**Post date:** [August 28, 2019, 9:38pm UTC](https://phaser.discourse.group/t/how-to-allow-tile-collision-only-to-the-top/3589/2 "2019-08-28T21:38:39Z")

</div>

I guess you could use **setCollision()**.  
See [https://photonstorm.github.io/phaser3-docs/Phaser.Tilemaps.Tile.html](https://photonstorm.github.io/phaser3-docs/Phaser.Tilemaps.Tile.html)

---

<div class="post-metadata">

**Author:** ![sH4rK0](https://yyz2.discourse-cdn.com/free1/user_avatar/phaser.discourse.group/sh4rk0/32/1996_2.png) [@sH4rK0](https://phaser.discourse.group/u/sH4rK0)\
**Post date:** [August 30, 2019, 10:47am UTC](https://phaser.discourse.group/t/how-to-allow-tile-collision-only-to-the-top/3589/3 "2019-08-30T10:47:54Z")

</div>

In this example (typescript) I iterate all map tiles (only once) and then assign a custom collide only on the tiles with the property customCollide true.  
The property customCollide is a custom property assigned to certain tiles using Tiled editor.  
this.map.forEachTile((tile: Phaser.Tilemaps.Tile) =\> {  
if (tile.properties.customCollide != undefined) {  
tile.setCollision(false, false, true, false, true);  
}  
}, this);

---

<div class="post-metadata">

**Author:** ![MEJS](https://yyz2.discourse-cdn.com/free1/user_avatar/phaser.discourse.group/mejs/32/2427_2.png) [@MEJS](https://phaser.discourse.group/u/MEJS)\
**Post date:** [April 20, 2021, 2:41pm UTC](https://phaser.discourse.group/t/how-to-allow-tile-collision-only-to-the-top/3589/4 "2021-04-20T14:41:41Z")

</div>

I have exacly same problem, but my character fall down from the map when i move him on the right. Anybody has fix for this? When tiles with ‘collideTop’ property are upper this works fine 😕

![image](https://global.discourse-cdn.com/free1/uploads/phaser1/original/2X/5/51eb386bd144b2221b9530b067ddc3331f5384c2.png)

---

<div class="post-metadata">

**Author:** ![kittykatattack](https://yyz2.discourse-cdn.com/free1/user_avatar/phaser.discourse.group/kittykatattack/32/3888_2.png) [@kittykatattack](https://phaser.discourse.group/u/kittykatattack)\
**Post date:** [April 21, 2021, 10:23am UTC](https://phaser.discourse.group/t/how-to-allow-tile-collision-only-to-the-top/3589/5 "2021-04-21T10:23:40Z")

</div>

Assuming you’re creating your platforms with Tiled Editor on a tile layer called “platofrms” and you’ve assigned the tile property name name “jumpThrough” for tiles that you want to be collid-able only from the top, something like this should work:

```javascript
this.platforms = map.createLayer("platforms", null, 0, 0);
this.platforms.setCollisionByExclusion(-1, true);

this.platforms.forEachTile(tile => {
      if (tile.properties.name === "jumpThrough") {
        tile.setCollision(false, false, true, false);
      }
    });

```

---

<div class="post-metadata">

**Author:** ![MEJS](https://yyz2.discourse-cdn.com/free1/user_avatar/phaser.discourse.group/mejs/32/2427_2.png) [@MEJS](https://phaser.discourse.group/u/MEJS)\
**Post date:** [April 28, 2021, 4:47pm UTC](https://phaser.discourse.group/t/how-to-allow-tile-collision-only-to-the-top/3589/6 "2021-04-28T16:47:33Z")

</div>

It isn’t working. My player always fall down when I move. This is my code:

```javascript
        this.map = this.add.tilemap('level2');
        let tileset = this.map.addTilesetImage('lvl2_sprites', 'tilesetNameInPhaser');
        this.floor = this.map.createStaticLayer('floor', [tileset], 0, 0);    
        // collision    
        this.physics.add.collider([this.player], [this.floor]);
        this.floor.setCollisionByExclusion(-1, true);
        this.floor.tilemap.forEachTile((tile) => {
            if (tile.properties.collidesTop) {
                tile.setCollision(false, false, true, false);
            }
        })

```