How to fix: the default size is shown before jQuery detects the width and height, and it won't resize until i do it manually

karenpunk

in Processing with Other Languages • 1 year ago

Hi everyone,

i use processing.js and jQuery and the code below to detect the size of the browser

void setup () {

    size( $(window).width(),
        $(window).height() );

However, the default size is shown before the jQuery successfully detects the width and height, and it won't resize until i do it manually

i am thinking about automatic page refresh .

So how can i tell the computer to refresh page after document loaded?

btw, window.innerWidth, window.innerHeight works the same as what i see with jQuery

Replies(5)

tfguy44

1 year ago

setup() only runs once, at the start of your sketch. It isn't going to magically get called again just because you resize the window.

karenpunk

1 year ago

So are there any methods to fix that?

i want it resize as soon as the js is loaded.

To delay the size function??

geraldo

1 year ago

Using jquery document.width() works for me - as also should window.width():

size(jQuery(document).width(),jQuery(document).height());

karenpunk

1 year ago

That's what causes my problem, dear.

v.k.

1 year ago

size

<script src="processing-1.4.1.min.js"></script>
<script type="text/processing" data-processing-target="processing-canvas">
/// this will not resize with window, but will fit the sketch in the size
/// of the window when it loads
/// i don't know how to handle resize in processingjs
void setup()
{
/// those ugly hard numbers to compensate for default safari borders.
/// in P5 i used java.awt.Insets; // but i think you need to find those in javaScript.
/// don't know how.
size(window.innerWidth-20, window.innerHeight-20);
}
void draw()
{
background(0);
stroke(255);
for (int i = 0; i < window.innerWidth; i += 30)
{
for (int j = 0; j < window.innerHeight; j += 30)
{
line(i,0, i,window.innerHeight);
line(0, j, window.innerWidth,j);
}
}
}
</script>
<canvas id="processing-canvas"> </canvas>

Top Reply