Jump to content

Search the Community

Showing results for tags 'scrolling'.

  • Search By Tags

    Type tags separated by commas.
  • Search By Author

Content Type


  • HTML5 Game Coding
    • News
    • Game Showcase
    • Facebook Instant Games
    • Web Gaming Standards
    • Coding and Game Design
  • Frameworks
    • Phaser 3
    • Phaser 2
    • Pixi.js
    • Babylon.js
    • Panda 2
    • melonJS
  • General
    • General Talk
  • Business
    • Collaborations (un-paid)
    • Jobs (Hiring and Freelance)
    • Services Offered

Find results in...

Find results that contain...

Date Created

  • Start


Last Updated

  • Start


Filter by number of...


  • Start



Website URL





  1. Hi guys! This is my new plugin to horizontal and vertical scrolling http://jdnichollsc.github.io/Phaser-Kinetic-Scrolling-Plugin/ PD: nothing to do with Kinect, the old name haha Regards, Nicholls
  2. No matter what I try or how I implement things, I keep getting some jittery scroll movement. I was using the <canvas> tag before this, without PixiJS and it was a lot of jittery movement. Just one drawImage call per rAF-call would take far more than 16,6 ms. I used the <canvas> for drawing frames. But I also used the transform CSS property for instance. With and without CSS transitions. But currently I'm using PixiJS with a RenderTexture and the scrolling still seems somewhat jittery to me, though maybe less jittery. I'm not drawing vector graphics. I'm drawing
  3. I'm rendering the content of some PNG's via a 4096 by 4096 RenderTexture, to cram all of it in the GPU memory, for scrolling usage. As each column should be 1024 pixels wide I can store a maximum of 16384 pixels of height to scroll through. I use 4096 as width and height because of http://webglstats.com/webgl/parameter/MAX_TEXTURE_SIZE But what to do if I want more than 16384 pixels to scroll through in one go? Suddenly realised: Should I just use some extra texture(s) of 4096 by 4096? It looks like a maximum of 8 textures is a safe bet: http://webglstats.com/webgl/parameter/MAX_TE
  4. Hey, for my project i need a scrolling text view. I've managed to get a clunky version working but it's not optimal since you have to play around with the values every time the text changes: http://playground.babylonjs.com/#DZ7134 Is there a better way (there must be, i just suck at js :D) to do this? Thanks in advance.
  5. Hi Been working on a top down car game for quite a while and creating my own render using 2d canvas. Looked at pixiJS and decided to update the render with that to get the benefit from webGL and perhaps other nice useful features that I don't know about yet. I create tiles in photoshop, draw the map in many layers in Tiled and then in my game I pre render all background layers and my foreground layers into 2 large canvases stored in memory which I then use to draw what the player sees based on my camera that is tracking the hero. Now that I'm switching to pixiJS I'm confused ab
  6. Hi, First I apologise if this has already been covered but I have searched and searched and not found a clear answer. In basic terms, I am trying to build a horizontal scrolling platformer that resizes as you change the size of its container. The functionality that I am trying to achieve can be seen in the Melon JS engine and results in no blank bars to the left & right or top & bottom. Thanks in advance. David
  7. I am having trouble figuring out how to do a scrolling background using multiple background images. These images are not overlayed to create a parallax effect, but rather next to each other to create a changing background scene. My background is created using 20 different images who's order must be dynamically changed as the background scrolls. So I can start with A,B,C showing and as it moves I need to remove A and add D after C...and so forth. I tried using tweens, but it is almost impossible to to place the next image at the correct starting position without gaps form
  8. What would be the best way to have a continuously scrolling background? I'm new to JS/Phaser, but the way I would usually approach it would to be have an art based background (not tiled) which is constructed on the fly so to speak from various elements (clouds, buildings, etc). Would that work with JS/Phaser? and if so how would I implement that with Phaser? (Actually I guess tiled might work as well if I could have overlapping tile layers one with big objects and one with small platformy type objects).
  9. hi developers, i am try to scroll in specific game place using the Phaser Kinetic Scrolling Plugin . but its working with game full width and height how to solve this problem?
  10. Jerkoco

    How Camera works ?

    Hello ! I'm currently making a custom engine in JavaScript (canvas). I already did sprites, particles, events (touch, keyboard, mouse) and a basic script to render tilemaps (no scrolling yet) I want to code the scrolling, camera and world system. If I create a game with a world of 30,000 pixels width and 15,000 pixels height, and my camera is in 800x and 800y for exemple; should I: -Call render and update functions for every element in the world (even if they are outside the canvas) -Get elements who are in the camera to update and render them. - Should I do something
  11. Hi There, I am trying to create a sandbox world with tile sprite, where as the player moves left to right and top to bottom, and they only ever see the image once and it doesn't actually tile. I've read that you can do this by setting the world bounds and tile sprite size to the actual size of the image. When I do this it seems to work okay, however the moment I position the player it causes the background to offset in a way where I am seeing the tile repeat, which is not the desired effect. I was hoping somebody on the forum might have some insight or experience with how to do this? I've
  12. Hi everyone! I'm trying to make a top down racing game, but I can't find a way to make a proper scrolling background. Every example I find is about tiles but my background is not something I can repeat horizontally. The background image is basically the track, so I need that image to be 100% width and repeated vertically, with an infinite vertical scroll. Can you please give me a hint? Thanks in advance! Damian
  13. So I implemented this piece of code that scrolls around (up/down/left/right) using the mouse pointer. I basically have a map and I am scrolling to see areas that I don't normally see because the canvas size is much smaller than the map itself and that's how I want it since you can zoom in/out too. What do you think about my code and what would you change and how can I make it better? //in create() this.currentX = this.game.input.activePointer.x; this.currentY = this.game.input.activePointer.y; //in update() if(this.game.input.activePo
  14. In (re)acquainting myself with Pixi for some hobby projects, I put together a simple example and walkthrough of scaling to fit device dimensions, using hi-res resources, animating a sprite, doing some basic parallax scrolling with tiling sprites, and assembling spritesheets with TexturePacker: http://www.rocketshipgames.com/blogs/tjkopena/2015/09/basic-scaling-animation-and-parallax-in-pixi-js-v3/ I hope it's of use to somebody, and would love to hear any comments about any errors or sub-optimal code. Thanks!
  15. Hi, I built a small top down game using a static tilemap, and i would now like to go further and make the level infinite by scrolling vertically and generating bits of my map on the fly. I checked some of the threads here but did not come up with a solution to my problem, and i am now quite confused: Is it possible to achieve this the way i want to? Should i generate tilemap layers as the map scrolls and destroy them once they cross the screen limits? Was the whole tilemap thing a mistake and should i generate sprites instead? If anyone here has experience on the matter or some solutions t
  16. In (re)acquainting myself with Pixi for some hobby projects, I put together a simple example and walkthrough of scaling to fit device dimensions, using hi-res resources, animating a sprite, doing some basic parallax scrolling with tiling sprites, and assembling spritesheets with TexturePacker: http://www.rocketshipgames.com/blogs/tjkopena/2015/09/basic-scaling-animation-and-parallax-in-pixi-js-v3/ The code is very much based around Pixi, but it's easy to understand without being familiar with that API, and I thought the article makes enough broad points to be worth crossposting to this gener
  17. Are there any examples of scrolling for Phaser anywhere. Something like the camera following a sprite moving around on an image much larger then the game window. Jason
  18. Hi friends! Who have used my plugin? What did you think? Plugin: http://jdnichollsc.github.io/Phaser-Kinetic-Scrolling-Plugin/ I would like to give me feedback Regards, Nicholls
  19. Hy guys! I'm trying to simulate the following (With the camera): http://ariya.ofilabs.com/2013/11/javascript-kinetic-scrolling-part-2.html My demo: http://codepen.io/jdnichollsc/pen/OVZPwx?editors=001 but I'm getting an error, Does anyone know it can be? Regards, Nicholls
  20. Hi, I have problem with swipes on Windows Phone. In our game characters are moved with swipes. It works well on all devices except Windows Phone. On Windows Phone whole canvas is moved when you try to make a swipe. I googled and added "-ms-touch-action: none;" to body style in css and also to div element that holds canvas in index.html (<div id="content" style="overflow: hidden; -ms-touch-action: none;"></div>). Unfortunately, I do not have WP available to test on. The person that encountered problem says, that problem is still there. I would like to ask: did you encountered
  21. I have an infinitely scrolling tile sprite as the background for my game. I want to use a camera to move instead of creating the illusion of movement by using: bg.tilePosition.x -= player.spd But, since the background is infinite and I need to set the world bounds, it can't be an infinite world. What would be the best way to do this? Thanks
  22. i want to set "this.game.camera.y < 1;" but failed to do so is it possible to slow down the scrolling speed less than 1 i tried 0.5, 0.1 and other fractional figures but less than 1 not works Please help me i got stucked
  23. I am new to Phaser and I am currently working on my first game. I'm am creating a vertical scroller and have come across some performance issues on mobile. I have a 1024x4608 background with some 'land' that needs collision detection with the 'player' and the 'enemies' in the game. I've been trying a couple approaches but can't seem to find the sweet spot with the performance. I was hoping someone would have some suggestions. Here's what I've tried so far: 1) Tilemap this.load.tilemap('level01_map', 'assets/level01_map.json', null, Phaser.Tilemap.TILED_JSON);this.load.image('tiles', '
  24. I am loading a small tile map (created in tiled) and scaling it to be double the size to fill the screen. The scaling works but something is off with the tile layer scrolling. The tile layers scroll on the x axis as the player moves to the right but it stops short of the end of the level (meaning the player continues on but the tile layers stop scrolling short of the boundry). I suspect this is something with my bounds settings but I'm not getting anywhere adjusting settings. Even worse, the tile layers do not scroll at all on the Y axis. Has anyone had a similar issue or a possible fix? I fig
  25. Hello everyone, I have a problem about a list scrolling issue and attached an SS. The problem is, I have some elements just like you see at the SS. Menu 1 and menu 2 is static but the content part must be scrollable. The content part is dynamic so it can grow in numbers. With the state of the current project they are scrollable but the content part is sliding through the back of the menu part. I just want a nice scrollable part so the content will be hidden of masked when getting throughout the menus or the header part. Thanks in advance.
  • Create New...