+ 3

Why isn't window resizing properly? [Solved]

So here I have window resize and window orientation for setting new canvas size but it is behaving very weirdly ,why so? Ty in advance! https://code.sololearn.com/WaquucARe5Df/?ref=app

1st Sep 2020, 11:06 PM
Abhay
Abhay - avatar
10 odpowiedzi
+ 5
Abhay also add <meta name="viewport"  content="width=device-width, initial-scale=1.0"/>
2nd Sep 2020, 12:28 AM
BroFar
BroFar - avatar
+ 4
Kode Krasher looks nice ,ty for that, Also i was talking about YouTube vids ,I am sure most do watch in phone ,atleast I do
2nd Sep 2020, 12:16 PM
Abhay
Abhay - avatar
+ 3
Kode Krasher thks but I am coding from sololearn playground and I don't see those reports ,about === instead == ,thks for mentioning that See I am on my phone coding and when I change the orientation angle to landscape and then back to portrait mode the problem occurs ,window doesn't resize properly ,it logs out window width as 612 instead of 360 ,first it goes 360 when the window opens ,then 640 on changing angle to landscape mode then 612 after rotating again and so canvas also doesn't resize because of this About orientation ,I was going through tutorials on how would I resize my canavs to fit device ,one article had listening for orientation and resize events saying that orientation would work well when mobiles are rotated and resize for desktop ,so I thought adding both event would be better although resize works fine but still in case it doesn't in case of any orientation, then that other event will handle it
2nd Sep 2020, 8:10 AM
Abhay
Abhay - avatar
+ 3
Ty very much Mirielle and BroFar
2nd Sep 2020, 11:04 AM
Abhay
Abhay - avatar
+ 3
Kode Krasher ty very much☺️ that's what I wanted to hear! And thks for suggestion
3rd Sep 2020, 12:18 PM
Abhay
Abhay - avatar
+ 2
Kode Krasher ty for that info but it wasn't working well for my device before I made the changes as suggested above That must be really not so good experience watching videos in that portrait mode😐!
2nd Sep 2020, 11:02 AM
Abhay
Abhay - avatar
+ 2
Kode Krasher I am calculating new x ,y, width and height for the figure using this newX+=canvas.width*(20/344); newY+=canvas.height*(20/492); newWidth+=canvas.width*(40/344) newHeight+=canvas.height*(40/492); heart_posX=canvas.width*(150/344); heart_posY=canvas.height*(170/492); 150 and 170 are x and y position for centering the figure according to my device resolution
2nd Sep 2020, 5:04 PM
Abhay
Abhay - avatar
+ 2
Kode Krasher thks a lot😊 ,I was worried about how would it look in devices with width greater than height
2nd Sep 2020, 5:24 PM
Abhay
Abhay - avatar
+ 2
Kode Krasher indeed! Also does it works nicely as of now? I made a little change because for a resolution 624×212(landscape mode) it was really off from center and was bigger than canvas size
2nd Sep 2020, 6:00 PM
Abhay
Abhay - avatar
+ 2
Kode Krasher thks a lot and sorry if I am asking for much! , And I think 624×212 resolution is unlikely to be used but it should still look good because with the current calculations it stretches the figure a lot as width is quite big in landscape one ,happy coding to you as well!✌️
2nd Sep 2020, 6:37 PM
Abhay
Abhay - avatar