# \[p5.js\] Is it possible to edit the 'initial-scale' of 'meta\[name=viewport\]'?
**URL:** https://discourse.processing.org/t/p5-js-is-it-possible-to-edit-the-initial-scale-of-meta-name-viewport/34087
**Category:** Coding Questions
**Created:** [December 13, 2021, 3:44am UTC](https://discourse.processing.org/t/p5-js-is-it-possible-to-edit-the-initial-scale-of-meta-name-viewport/34087 "2021-12-13T03:44:33Z")
**Posts on this page:** 9
**Page:** 1
### Author:  [@GWAK](https://discourse.processing.org/u/GWAK)
#### Post date: [December 13, 2021, 3:44am UTC](https://discourse.processing.org/t/p5-js-is-it-possible-to-edit-the-initial-scale-of-meta-name-viewport/34087/1 "2021-12-13T03:44:33Z")
Is it possible to edit the ‘initial-scale’ of ‘meta[name=viewport]’?
through ‘js’
\*link: [html - Change initial scale with javascript - Stack Overflow](https://stackoverflow.com/questions/15010503/change-initial-scale-with-javascript)
```auto
if (document.documentElement.clientWidth < 480) {
document.querySelector("meta[name=viewport]").setAttribute(
'content',
'width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0');
}
```
through ‘p5.js’
```auto
cbox= select('meta[name=viewport]');
cbox.ele.initial-scale=1.0; // <- This error.
```
Any solution?
---
### Author:  [@KumuPaul](https://discourse.processing.org/u/KumuPaul)
#### Post date: [December 13, 2021, 4:47am UTC](https://discourse.processing.org/t/p5-js-is-it-possible-to-edit-the-initial-scale-of-meta-name-viewport/34087/2 "2021-12-13T04:47:23Z")
1. `cbox.ele.initial-scale = 1.0` is invalid JavaScript because you can’t have a hyphen (`-`) in an identifier.
2. Even if you used correct syntax: `cbox.ele['initial-scale'] = '1.0'` this would have no effect because you would be setting a property on the `HTMLElement` which would not do anything meaningful to the DOM, as `initial-scale` isn’t as supported attribute on the meta tag.
3. The equivalent `p5.js` code would set the `content` attribute of the element in question:
```auto
cbox= select('meta[name=viewport]');
// EDIT: removed typo: cbox.ele
cbox.attribute('content', 'width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0');
```
See [p5.Element.attribute()](https://p5js.org/reference/#/p5.Element/attribute)
---
### Author:  [@GWAK](https://discourse.processing.org/u/GWAK)
#### Post date: [December 13, 2021, 5:14am UTC](https://discourse.processing.org/t/p5-js-is-it-possible-to-edit-the-initial-scale-of-meta-name-viewport/34087/3 "2021-12-13T05:14:57Z")
Dear KumuPaul / @KumuPaul
[P5.JS]
```auto
function setup() {
createCanvas(600, 1100);
cbox= select('meta[name=viewport]');
cbox.ele.attribute('content', 'width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0');
background(0);
}
function draw() {
}
```
[HTML]
```auto
```
It doesn’t work.
`cbox.ele.attribute('content', 'width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0');`
doesn’t seem to be working.
---
### Author:  [@KumuPaul](https://discourse.processing.org/u/KumuPaul)
#### Post date: [December 13, 2021, 5:41am UTC](https://discourse.processing.org/t/p5-js-is-it-possible-to-edit-the-initial-scale-of-meta-name-viewport/34087/4 "2021-12-13T05:41:51Z")
Sorry there was a typo in my code:
```auto
cbox= select('meta[name=viewport]');
// Note: calling attribute on cbox, not cbox.ele
cbox.attribute('content', 'width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0');
```
---
### Author:  [@GWAK](https://discourse.processing.org/u/GWAK)
#### Post date: [December 13, 2021, 7:43am UTC](https://discourse.processing.org/t/p5-js-is-it-possible-to-edit-the-initial-scale-of-meta-name-viewport/34087/5 "2021-12-13T07:43:17Z")
@KumuPaul
very very Thank you.
but,
I have one question.
case 1
``
case 2
``
case 3
``
No matter how much I change the html, is it the same as what I see on a real smartphone?
I can’t understand.
---
### Author:  [@KumuPaul](https://discourse.processing.org/u/KumuPaul)
#### Post date: [December 13, 2021, 7:58am UTC](https://discourse.processing.org/t/p5-js-is-it-possible-to-edit-the-initial-scale-of-meta-name-viewport/34087/6 "2021-12-13T07:58:01Z")
I suggest you read [this page on MDN](https://developer.mozilla.org/en-US/docs/Web/HTML/Viewport_meta_tag) for an overview of how this setting is used. If you’re still struggling you should make a separate post outlining the specific layout you are trying to achieve on mobile, and sharing code with your best attempt.
---
### Author:  [@KumuPaul](https://discourse.processing.org/u/KumuPaul)
#### Post date: [December 13, 2021, 8:02am UTC](https://discourse.processing.org/t/p5-js-is-it-possible-to-edit-the-initial-scale-of-meta-name-viewport/34087/7 "2021-12-13T08:02:29Z")
A very basic example would be:
[https://testing.free-side.net/test-initial-scale.html](https://testing.free-side.net/test-initial-scale.html)
vs.
[https://testing.free-side.net/test-initial-scale.html?mobile=true](https://testing.free-side.net/test-initial-scale.html?mobile=true)
The former uses the default viewport width, and as a result renders the text very small. The later uses device-width (via the p5.js code to dynamically set the veiwport settings) and should show the text zoomed in to a more natural size and scrollable horizontally.
---
### Author:  [@GWAK](https://discourse.processing.org/u/GWAK)
#### Post date: [December 13, 2021, 8:33am UTC](https://discourse.processing.org/t/p5-js-is-it-possible-to-edit-the-initial-scale-of-meta-name-viewport/34087/8 "2021-12-13T08:33:44Z")
@KumuPaul
- TEST SITE : [http://goldstarit7.iptime.org:12005/testcode/index.html](http://goldstarit7.iptime.org:12005/testcode/index.html)
- index.html
```auto
```
`initial-scale=1.0`
Even if you change ‘initial-scale=1.0’ and access the site with a smartphone, the displayed screen is the same.
I don’t know why.
---
### Author:  [@GWAK](https://discourse.processing.org/u/GWAK)
#### Post date: [December 13, 2021, 9:16am UTC](https://discourse.processing.org/t/p5-js-is-it-possible-to-edit-the-initial-scale-of-meta-name-viewport/34087/9 "2021-12-13T09:16:29Z")
@KumuPaul
I think you’re right.
It seems it’s an internet ‘cash memory’ issue that ‘initial-scale=1.0’ doesn’t change.
Thank you for answer.