Groups | Search | Server Info | Keyboard shortcuts | Login | Register [http] [https] [nntp] [nntps]


Groups > comp.lang.javascript > #40405 > unrolled thread

CSS scale transform using javascript?

Started byJonas Thörnvall <jonas.thornvall@gmail.com>
First post2021-09-23 06:53 -0700
Last post2021-09-25 05:22 -0700
Articles 14 on this page of 34 — 2 participants

Back to article view | Back to comp.lang.javascript


Contents

  CSS scale transform using javascript? Jonas Thörnvall <jonas.thornvall@gmail.com> - 2021-09-23 06:53 -0700
    Re: CSS scale transform using javascript? Jonas Thörnvall <jonas.thornvall@gmail.com> - 2021-09-23 07:00 -0700
      Re: CSS scale transform using javascript? Jonas Thörnvall <jonas.thornvall@gmail.com> - 2021-09-23 07:01 -0700
        Re: CSS scale transform using javascript? Jonas Thörnvall <jonas.thornvall@gmail.com> - 2021-09-23 07:37 -0700
          Re: CSS scale transform using javascript? Jonas Thörnvall <jonas.thornvall@gmail.com> - 2021-09-23 08:50 -0700
            Re: CSS scale transform using javascript? Jonas Thörnvall <jonas.thornvall@gmail.com> - 2021-09-23 12:12 -0700
              Re: CSS scale transform using javascript? The Natural Philosopher <tnp@invalid.invalid> - 2021-09-24 14:16 +0100
                Re: CSS scale transform using javascript? Jonas Thörnvall <jonas.thornvall@gmail.com> - 2021-09-24 06:58 -0700
                  Re: CSS scale transform using javascript? The Natural Philosopher <tnp@invalid.invalid> - 2021-09-24 16:15 +0100
                    Re: CSS scale transform using javascript? Jonas Thörnvall <jonas.thornvall@gmail.com> - 2021-09-24 11:34 -0700
                      Re: CSS scale transform using javascript? The Natural Philosopher <tnp@invalid.invalid> - 2021-09-25 09:49 +0100
                    Re: CSS scale transform using javascript? Jonas Thörnvall <jonas.thornvall@gmail.com> - 2021-09-24 11:38 -0700
                      Re: CSS scale transform using javascript? The Natural Philosopher <tnp@invalid.invalid> - 2021-09-25 09:50 +0100
                        Re: CSS scale transform using javascript? Jonas Thörnvall <jonas.thornvall@gmail.com> - 2021-09-25 04:27 -0700
                        Re: CSS scale transform using javascript? Jonas Thörnvall <jonas.thornvall@gmail.com> - 2021-09-25 04:49 -0700
                          Re: CSS scale transform using javascript? Jonas Thörnvall <jonas.thornvall@gmail.com> - 2021-09-25 04:56 -0700
                          Re: CSS scale transform using javascript? The Natural Philosopher <tnp@invalid.invalid> - 2021-09-25 14:39 +0100
                            Re: CSS scale transform using javascript? Jonas Thörnvall <jonas.thornvall@gmail.com> - 2021-09-25 06:46 -0700
                              Re: CSS scale transform using javascript? The Natural Philosopher <tnp@invalid.invalid> - 2021-09-25 15:08 +0100
                                Re: CSS scale transform using javascript? Jonas Thörnvall <jonas.thornvall@gmail.com> - 2021-09-25 11:32 -0700
                                Re: CSS scale transform using javascript? Jonas Thörnvall <jonas.thornvall@gmail.com> - 2021-09-25 11:39 -0700
                                  Re: CSS scale transform using javascript? Jonas Thörnvall <jonas.thornvall@gmail.com> - 2021-09-25 11:46 -0700
                                Re: CSS scale transform using javascript? Jonas Thörnvall <jonas.thornvall@gmail.com> - 2021-09-25 13:27 -0700
                                Re: CSS scale transform using javascript? Jonas Thörnvall <jonas.thornvall@gmail.com> - 2021-09-28 12:36 -0700
                                  Re: CSS scale transform using javascript? Jonas Thörnvall <jonas.thornvall@gmail.com> - 2021-09-29 02:24 -0700
                                    Re: CSS scale transform using javascript? The Natural Philosopher <tnp@invalid.invalid> - 2021-09-29 11:52 +0100
                                      Re: CSS scale transform using javascript? Jonas Thörnvall <jonas.thornvall@gmail.com> - 2021-09-29 04:21 -0700
                                        Re: CSS scale transform using javascript? Jonas Thörnvall <jonas.thornvall@gmail.com> - 2021-09-29 05:43 -0700
                                        Re: CSS scale transform using javascript? The Natural Philosopher <tnp@invalid.invalid> - 2021-09-29 15:04 +0100
                        Re: CSS scale transform using javascript? Jonas Thörnvall <jonas.thornvall@gmail.com> - 2021-09-25 05:13 -0700
                          Re: CSS scale transform using javascript? Jonas Thörnvall <jonas.thornvall@gmail.com> - 2021-09-25 05:18 -0700
                          Re: CSS scale transform using javascript? Jonas Thörnvall <jonas.thornvall@gmail.com> - 2021-09-25 05:19 -0700
                            Re: CSS scale transform using javascript? Jonas Thörnvall <jonas.thornvall@gmail.com> - 2021-09-25 05:21 -0700
                            Re: CSS scale transform using javascript? Jonas Thörnvall <jonas.thornvall@gmail.com> - 2021-09-25 05:22 -0700

Page 2 of 2 — ← Prev page 1 [2]


#40442

FromJonas Thörnvall <jonas.thornvall@gmail.com>
Date2021-09-25 11:39 -0700
Message-ID<cc96436b-f26e-49bd-a28d-f5d7d2906d4dn@googlegroups.com>
In reply to#40440
lördag 25 september 2021 kl. 16:08:27 UTC+2 skrev The Natural Philosopher:
> On 25/09/2021 14:46, Jonas Thörnvall wrote: 
> > lördag 25 september 2021 kl. 15:39:31 UTC+2 skrev The Natural Philosopher: 
> >> On 25/09/2021 12:49, Jonas Thörnvall wrote: 
> >> 
> >>> 
> >>> So far the only thing that will scale it uniformly is. 
> >>> 
> >>> html { 
> >>> transform: scale(0.5,0.7); 
> >>> } 
> >>> 
> >>> So maybe one should have a script that invoke different CSS files deipendent on resolution. 
> >>> It seem idiotic to me, but.... 
> >>> 
> >> var x = document.getElementsByTagName("HTML")[0]; 
> >> 
> >> x.style.transform="scale(0.5,0.7)"; 
> >
> > Yeah but it doesn't work.... 
> >
> It does, I tested it 
> 
> <!DOCTYPE html> 
> <html> 
> <body> 
> 
> <h3>A demonstration of how to access an HTML element</h3> 
> 
> <p>Click the button to scale the document.</p> 
> 
> <button onclick="myFunction()">Try it</button> 
> 
> <p id="demo"></p> 
> 
> <script> 
> function myFunction() { 
> var x = document.getElementsByTagName("BODY")[0]; 
> x.style.transform = "scale(0.5,1.3)"; 
> } 
> </script> 
> 
> </body> 
> </html> 
> 
> 
> -- 
> There’s a mighty big difference between good, sound reasons and reasons 
> that sound good. 
> 
> Burton Hillis (William Vaughn, American columnist)
Yeah i like it, better then mine i hope it works over all browsers.
<script>
function getResolution() {
    dispWidth=screen.width;
   dispHeight=screen.height;
}
getResolution();
var xScale=dispWidth/220;
var yScale=dispHeight/180;
var dispScale = document.getElementsByTagName("BODY")[0];
dispScale.style.transform = "scale("+xScale+","+yScale+")";
</script>

[toc] | [prev] | [next] | [standalone]


#40443

FromJonas Thörnvall <jonas.thornvall@gmail.com>
Date2021-09-25 11:46 -0700
Message-ID<78fed343-90a7-4bdb-84db-7f05a13b7baan@googlegroups.com>
In reply to#40442
lördag 25 september 2021 kl. 20:39:51 UTC+2 skrev Jonas Thörnvall:
> lördag 25 september 2021 kl. 16:08:27 UTC+2 skrev The Natural Philosopher: 
> > On 25/09/2021 14:46, Jonas Thörnvall wrote: 
> > > lördag 25 september 2021 kl. 15:39:31 UTC+2 skrev The Natural Philosopher: 
> > >> On 25/09/2021 12:49, Jonas Thörnvall wrote: 
> > >> 
> > >>> 
> > >>> So far the only thing that will scale it uniformly is. 
> > >>> 
> > >>> html { 
> > >>> transform: scale(0.5,0.7); 
> > >>> } 
> > >>> 
> > >>> So maybe one should have a script that invoke different CSS files deipendent on resolution. 
> > >>> It seem idiotic to me, but.... 
> > >>> 
> > >> var x = document.getElementsByTagName("HTML")[0]; 
> > >> 
> > >> x.style.transform="scale(0.5,0.7)"; 
> > > 
> > > Yeah but it doesn't work.... 
> > > 
> > It does, I tested it 
> > 
> > <!DOCTYPE html> 
> > <html> 
> > <body> 
> > 
> > <h3>A demonstration of how to access an HTML element</h3> 
> > 
> > <p>Click the button to scale the document.</p> 
> > 
> > <button onclick="myFunction()">Try it</button> 
> > 
> > <p id="demo"></p> 
> > 
> > <script> 
> > function myFunction() { 
> > var x = document.getElementsByTagName("BODY")[0]; 
> > x.style.transform = "scale(0.5,1.3)"; 
> > } 
> > </script> 
> > 
> > </body> 
> > </html> 
> > 
> > 
> > -- 
> > There’s a mighty big difference between good, sound reasons and reasons 
> > that sound good. 
> > 
> > Burton Hillis (William Vaughn, American columnist)
> Yeah i like it, better then mine i hope it works over all browsers.
> <script> 
> function getResolution() { 
> dispWidth=screen.width; 
> dispHeight=screen.height; 
> } 
> getResolution();
> var xScale=dispWidth/220; 
> var yScale=dispHeight/180; 
> var dispScale = document.getElementsByTagName("BODY")[0]; 
> dispScale.style.transform = "scale("+xScale+","+yScale+")"; 
> </script>
Now when the solution so neat i may actually add sliders to zoom in.

[toc] | [prev] | [next] | [standalone]


#40444

FromJonas Thörnvall <jonas.thornvall@gmail.com>
Date2021-09-25 13:27 -0700
Message-ID<2623c2ab-7c0e-4275-904c-3b6b44227784n@googlegroups.com>
In reply to#40440
lördag 25 september 2021 kl. 16:08:27 UTC+2 skrev The Natural Philosopher:
> On 25/09/2021 14:46, Jonas Thörnvall wrote: 
> > lördag 25 september 2021 kl. 15:39:31 UTC+2 skrev The Natural Philosopher: 
> >> On 25/09/2021 12:49, Jonas Thörnvall wrote: 
> >> 
> >>> 
> >>> So far the only thing that will scale it uniformly is. 
> >>> 
> >>> html { 
> >>> transform: scale(0.5,0.7); 
> >>> } 
> >>> 
> >>> So maybe one should have a script that invoke different CSS files deipendent on resolution. 
> >>> It seem idiotic to me, but.... 
> >>> 
> >> var x = document.getElementsByTagName("HTML")[0]; 
> >> 
> >> x.style.transform="scale(0.5,0.7)"; 
> >
> > Yeah but it doesn't work.... 
> >
> It does, I tested it 
> 
> <!DOCTYPE html> 
> <html> 
> <body> 
> 
> <h3>A demonstration of how to access an HTML element</h3> 
> 
> <p>Click the button to scale the document.</p> 
> 
> <button onclick="myFunction()">Try it</button> 
> 
> <p id="demo"></p> 
> 
> <script> 
> function myFunction() { 
> var x = document.getElementsByTagName("BODY")[0]; 
> x.style.transform = "scale(0.5,1.3)"; 
> } 
> </script> 
> 
> </body> 
> </html> 
> 
> 
> -- 
> There’s a mighty big difference between good, sound reasons and reasons 
> that sound good. 
> 
> Burton Hillis (William Vaughn, American columnist)
This seem ok to me have to test on mobiles.

function getResolution() {
dispWidth=screen.width;
dispHeight=screen.height;
}
function changeResolution() {
getResolution();
//if display higher then wide "mobiles?"
if (dispWidth<dispHeight){
var tempScale=dispWidth;
dipsWidth=dispHeight;
dispHeight=tempScale;
}
//rescale to display
var xScale=dispWidth/1920;
var yScale=dispHeight/1080;
//Only if scale not native
if(dispWidth!=1920 && dispHeight!=1080){
var dispScale = document.getElementsByTagName("BODY")[0];
dispScale.style.transform = "scale("+xScale*0.96+","+yScale*0.95+")";
}
}
changeResolution();
</script>

[toc] | [prev] | [next] | [standalone]


#40449

FromJonas Thörnvall <jonas.thornvall@gmail.com>
Date2021-09-28 12:36 -0700
Message-ID<70fb9c28-1e7e-40e4-92e3-0f685eb9a72an@googlegroups.com>
In reply to#40440
lördag 25 september 2021 kl. 16:08:27 UTC+2 skrev The Natural Philosopher:
> On 25/09/2021 14:46, Jonas Thörnvall wrote: 
> > lördag 25 september 2021 kl. 15:39:31 UTC+2 skrev The Natural Philosopher: 
> >> On 25/09/2021 12:49, Jonas Thörnvall wrote: 
> >> 
> >>> 
> >>> So far the only thing that will scale it uniformly is. 
> >>> 
> >>> html { 
> >>> transform: scale(0.5,0.7); 
> >>> } 
> >>> 
> >>> So maybe one should have a script that invoke different CSS files deipendent on resolution. 
> >>> It seem idiotic to me, but.... 
> >>> 
> >> var x = document.getElementsByTagName("HTML")[0]; 
> >> 
> >> x.style.transform="scale(0.5,0.7)"; 
> >
> > Yeah but it doesn't work.... 
> >
> It does, I tested it 
> 
> <!DOCTYPE html> 
> <html> 
> <body> 
> 
> <h3>A demonstration of how to access an HTML element</h3> 
> 
> <p>Click the button to scale the document.</p> 
> 
> <button onclick="myFunction()">Try it</button> 
> 
> <p id="demo"></p> 
> 
> <script> 
> function myFunction() { 
> var x = document.getElementsByTagName("BODY")[0]; 
> x.style.transform = "scale(0.5,1.3)"; 
> } 
> </script> 
> 
> </body> 
> </html> 
> 
> 
> -- 
> There’s a mighty big difference between good, sound reasons and reasons 
> that sound good. 
> 
> Burton Hillis (William Vaughn, American columnist)
Just for fun i added sliders for scaling, but to be useful I should created another slider resolution for it "CSS" i used the midi i already had 0-127 so it isn't exactly finetuned zoomwise.
But one wonder if one could keep them locked outside "the scaling document".

[toc] | [prev] | [next] | [standalone]


#40450

FromJonas Thörnvall <jonas.thornvall@gmail.com>
Date2021-09-29 02:24 -0700
Message-ID<c9aa6bce-b78b-41d4-9e6e-7a663a50cff2n@googlegroups.com>
In reply to#40449
tisdag 28 september 2021 kl. 21:36:15 UTC+2 skrev Jonas Thörnvall:
> lördag 25 september 2021 kl. 16:08:27 UTC+2 skrev The Natural Philosopher: 
> > On 25/09/2021 14:46, Jonas Thörnvall wrote: 
> > > lördag 25 september 2021 kl. 15:39:31 UTC+2 skrev The Natural Philosopher: 
> > >> On 25/09/2021 12:49, Jonas Thörnvall wrote: 
> > >> 
> > >>> 
> > >>> So far the only thing that will scale it uniformly is. 
> > >>> 
> > >>> html { 
> > >>> transform: scale(0.5,0.7); 
> > >>> } 
> > >>> 
> > >>> So maybe one should have a script that invoke different CSS files deipendent on resolution. 
> > >>> It seem idiotic to me, but.... 
> > >>> 
> > >> var x = document.getElementsByTagName("HTML")[0]; 
> > >> 
> > >> x.style.transform="scale(0.5,0.7)"; 
> > > 
> > > Yeah but it doesn't work.... 
> > > 
> > It does, I tested it 
> > 
> > <!DOCTYPE html> 
> > <html> 
> > <body> 
> > 
> > <h3>A demonstration of how to access an HTML element</h3> 
> > 
> > <p>Click the button to scale the document.</p> 
> > 
> > <button onclick="myFunction()">Try it</button> 
> > 
> > <p id="demo"></p> 
> > 
> > <script> 
> > function myFunction() { 
> > var x = document.getElementsByTagName("BODY")[0]; 
> > x.style.transform = "scale(0.5,1.3)"; 
> > } 
> > </script> 
> > 
> > </body> 
> > </html> 
> > 
> > 
> > -- 
> > There’s a mighty big difference between good, sound reasons and reasons 
> > that sound good. 
> > 
> > Burton Hillis (William Vaughn, American columnist)
> Just for fun i added sliders for scaling, but to be useful I should created another slider resolution for it "CSS" i used the midi i already had 0-127 so it isn't exactly finetuned zoomwise. 
> But one wonder if one could keep them locked outside "the scaling document".
Well locked positonwise.

[toc] | [prev] | [next] | [standalone]


#40451

FromThe Natural Philosopher <tnp@invalid.invalid>
Date2021-09-29 11:52 +0100
Message-ID<sj1gh6$gb$1@dont-email.me>
In reply to#40450
On 29/09/2021 10:24, Jonas Thörnvall wrote:
> tisdag 28 september 2021 kl. 21:36:15 UTC+2 skrev Jonas Thörnvall:
>> lördag 25 september 2021 kl. 16:08:27 UTC+2 skrev The Natural Philosopher:
>>> On 25/09/2021 14:46, Jonas Thörnvall wrote:
>>>> lördag 25 september 2021 kl. 15:39:31 UTC+2 skrev The Natural Philosopher:
>>>>> On 25/09/2021 12:49, Jonas Thörnvall wrote:
>>>>>
>>>>>>
>>>>>> So far the only thing that will scale it uniformly is.
>>>>>>
>>>>>> html {
>>>>>> transform: scale(0.5,0.7);
>>>>>> }
>>>>>>
>>>>>> So maybe one should have a script that invoke different CSS files deipendent on resolution.
>>>>>> It seem idiotic to me, but....
>>>>>>
>>>>> var x = document.getElementsByTagName("HTML")[0];
>>>>>
>>>>> x.style.transform="scale(0.5,0.7)";
>>>>
>>>> Yeah but it doesn't work....
>>>>
>>> It does, I tested it
>>>
>>> <!DOCTYPE html>
>>> <html>
>>> <body>
>>>
>>> <h3>A demonstration of how to access an HTML element</h3>
>>>
>>> <p>Click the button to scale the document.</p>
>>>
>>> <button onclick="myFunction()">Try it</button>
>>>
>>> <p id="demo"></p>
>>>
>>> <script>
>>> function myFunction() {
>>> var x = document.getElementsByTagName("BODY")[0];
>>> x.style.transform = "scale(0.5,1.3)";
>>> }
>>> </script>
>>>
>>> </body>
>>> </html>
>>>
>>>
>>> -- 
>>> There’s a mighty big difference between good, sound reasons and reasons
>>> that sound good.
>>>
>>> Burton Hillis (William Vaughn, American columnist)
>> Just for fun i added sliders for scaling, but to be useful I should created another slider resolution for it "CSS" i used the midi i already had 0-127 so it isn't exactly finetuned zoomwise.
>> But one wonder if one could keep them locked outside "the scaling document".
> Well locked positonwise.
> 
yes.
essentially you are scaling with the above code the HTML entity called 
'BODY'

You could create a <div ID ="SCALEME">  inside that and scale that using

document.getElementById("SCALEME")

instead.

You need to read up on the DOM in Javascript. Eacg nested HTML object, 
is  a Document Object Module and can be selected by name, tagname, ID or 
class. If that selects more than one, you get an array that you can loop 
through.

Then everything inside the object is accessible by javascript.


-- 
All political activity makes complete sense once the proposition that 
all government is basically a self-legalising protection racket, is 
fully understood.

[toc] | [prev] | [next] | [standalone]


#40452

FromJonas Thörnvall <jonas.thornvall@gmail.com>
Date2021-09-29 04:21 -0700
Message-ID<2f378ccc-17c7-44e0-aa94-2e3e87a4e81cn@googlegroups.com>
In reply to#40451
onsdag 29 september 2021 kl. 12:52:30 UTC+2 skrev The Natural Philosopher:
> On 29/09/2021 10:24, Jonas Thörnvall wrote: 
> > tisdag 28 september 2021 kl. 21:36:15 UTC+2 skrev Jonas Thörnvall: 
> >> lördag 25 september 2021 kl. 16:08:27 UTC+2 skrev The Natural Philosopher: 
> >>> On 25/09/2021 14:46, Jonas Thörnvall wrote: 
> >>>> lördag 25 september 2021 kl. 15:39:31 UTC+2 skrev The Natural Philosopher: 
> >>>>> On 25/09/2021 12:49, Jonas Thörnvall wrote: 
> >>>>> 
> >>>>>> 
> >>>>>> So far the only thing that will scale it uniformly is. 
> >>>>>> 
> >>>>>> html { 
> >>>>>> transform: scale(0.5,0.7); 
> >>>>>> } 
> >>>>>> 
> >>>>>> So maybe one should have a script that invoke different CSS files deipendent on resolution. 
> >>>>>> It seem idiotic to me, but.... 
> >>>>>> 
> >>>>> var x = document.getElementsByTagName("HTML")[0]; 
> >>>>> 
> >>>>> x.style.transform="scale(0.5,0.7)"; 
> >>>> 
> >>>> Yeah but it doesn't work.... 
> >>>> 
> >>> It does, I tested it 
> >>> 
> >>> <!DOCTYPE html> 
> >>> <html> 
> >>> <body> 
> >>> 
> >>> <h3>A demonstration of how to access an HTML element</h3> 
> >>> 
> >>> <p>Click the button to scale the document.</p> 
> >>> 
> >>> <button onclick="myFunction()">Try it</button> 
> >>> 
> >>> <p id="demo"></p> 
> >>> 
> >>> <script> 
> >>> function myFunction() { 
> >>> var x = document.getElementsByTagName("BODY")[0]; 
> >>> x.style.transform = "scale(0.5,1.3)"; 
> >>> } 
> >>> </script> 
> >>> 
> >>> </body> 
> >>> </html> 
> >>> 
> >>> 
> >>> -- 
> >>> There’s a mighty big difference between good, sound reasons and reasons 
> >>> that sound good. 
> >>> 
> >>> Burton Hillis (William Vaughn, American columnist) 
> >> Just for fun i added sliders for scaling, but to be useful I should created another slider resolution for it "CSS" i used the midi i already had 0-127 so it isn't exactly finetuned zoomwise. 
> >> But one wonder if one could keep them locked outside "the scaling document". 
> > Well locked positonwise. 
> >
> yes. 
> essentially you are scaling with the above code the HTML entity called 
> 'BODY' 
> 
> You could create a <div ID ="SCALEME"> inside that and scale that using 
> 
> document.getElementById("SCALEME") 
> 
> instead. 
> 
> You need to read up on the DOM in Javascript. Eacg nested HTML object, 
> is a Document Object Module and can be selected by name, tagname, ID or 
> class. If that selects more than one, you get an array that you can loop 
> through. 
> 
> Then everything inside the object is accessible by javascript. 
> 
> 
> -- 
> All political activity makes complete sense once the proposition that 
> all government is basically a self-legalising protection racket, is 
> fully understood.
i see a problem with the div tag as is, if you have a very big document with iframes it can be hard to keep track of closures. So when you try frame the region it might not frame the region you want.
That problem never occure with named closures of tags like </html>

And it is frustrating reading something like 
</div>
</div>
</div>
As closure way below your actual <div id's>
What did that one close....

[toc] | [prev] | [next] | [standalone]


#40453

FromJonas Thörnvall <jonas.thornvall@gmail.com>
Date2021-09-29 05:43 -0700
Message-ID<c3cf01e0-284b-4594-985f-479f53254acen@googlegroups.com>
In reply to#40452
onsdag 29 september 2021 kl. 13:22:01 UTC+2 skrev Jonas Thörnvall:
> onsdag 29 september 2021 kl. 12:52:30 UTC+2 skrev The Natural Philosopher: 
> > On 29/09/2021 10:24, Jonas Thörnvall wrote: 
> > > tisdag 28 september 2021 kl. 21:36:15 UTC+2 skrev Jonas Thörnvall: 
> > >> lördag 25 september 2021 kl. 16:08:27 UTC+2 skrev The Natural Philosopher: 
> > >>> On 25/09/2021 14:46, Jonas Thörnvall wrote: 
> > >>>> lördag 25 september 2021 kl. 15:39:31 UTC+2 skrev The Natural Philosopher: 
> > >>>>> On 25/09/2021 12:49, Jonas Thörnvall wrote: 
> > >>>>> 
> > >>>>>> 
> > >>>>>> So far the only thing that will scale it uniformly is. 
> > >>>>>> 
> > >>>>>> html { 
> > >>>>>> transform: scale(0.5,0.7); 
> > >>>>>> } 
> > >>>>>> 
> > >>>>>> So maybe one should have a script that invoke different CSS files deipendent on resolution. 
> > >>>>>> It seem idiotic to me, but.... 
> > >>>>>> 
> > >>>>> var x = document.getElementsByTagName("HTML")[0]; 
> > >>>>> 
> > >>>>> x.style.transform="scale(0.5,0.7)"; 
> > >>>> 
> > >>>> Yeah but it doesn't work.... 
> > >>>> 
> > >>> It does, I tested it 
> > >>> 
> > >>> <!DOCTYPE html> 
> > >>> <html> 
> > >>> <body> 
> > >>> 
> > >>> <h3>A demonstration of how to access an HTML element</h3> 
> > >>> 
> > >>> <p>Click the button to scale the document.</p> 
> > >>> 
> > >>> <button onclick="myFunction()">Try it</button> 
> > >>> 
> > >>> <p id="demo"></p> 
> > >>> 
> > >>> <script> 
> > >>> function myFunction() { 
> > >>> var x = document.getElementsByTagName("BODY")[0]; 
> > >>> x.style.transform = "scale(0.5,1.3)"; 
> > >>> } 
> > >>> </script> 
> > >>> 
> > >>> </body> 
> > >>> </html> 
> > >>> 
> > >>> 
> > >>> -- 
> > >>> There’s a mighty big difference between good, sound reasons and reasons 
> > >>> that sound good. 
> > >>> 
> > >>> Burton Hillis (William Vaughn, American columnist) 
> > >> Just for fun i added sliders for scaling, but to be useful I should created another slider resolution for it "CSS" i used the midi i already had 0-127 so it isn't exactly finetuned zoomwise. 
> > >> But one wonder if one could keep them locked outside "the scaling document". 
> > > Well locked positonwise. 
> > > 
> > yes. 
> > essentially you are scaling with the above code the HTML entity called 
> > 'BODY' 
> > 
> > You could create a <div ID ="SCALEME"> inside that and scale that using 
> > 
> > document.getElementById("SCALEME") 
> > 
> > instead. 
> > 
> > You need to read up on the DOM in Javascript. Eacg nested HTML object, 
> > is a Document Object Module and can be selected by name, tagname, ID or 
> > class. If that selects more than one, you get an array that you can loop 
> > through. 
> > 
> > Then everything inside the object is accessible by javascript. 
> > 
> > 
> > -- 
> > All political activity makes complete sense once the proposition that 
> > all government is basically a self-legalising protection racket, is 
> > fully understood.
> i see a problem with the div tag as is, if you have a very big document with iframes it can be hard to keep track of closures. So when you try frame the region it might not frame the region you want. 
> That problem never occure with named closures of tags like </html> 
> 
> And it is frustrating reading something like 
> </div> 
> </div> 
> </div> 
> As closure way below your actual <div id's> 
> What did that one close....
Added scaling by scroll, will make select buttons for X, Y,LOCKED

http://jtmidi.000webhostapp.com/

[toc] | [prev] | [next] | [standalone]


#40454

FromThe Natural Philosopher <tnp@invalid.invalid>
Date2021-09-29 15:04 +0100
Message-ID<sj1rov$non$1@dont-email.me>
In reply to#40452
On 29/09/2021 12:21, Jonas Thörnvall wrote:
> i see a problem with the div tag as is, if you have a very big document with iframes it can be hard to keep track of closures. So when you try frame the region it might not frame the region you want.
> That problem never occure with named closures of tags like </html>
> 
> And it is frustrating reading something like
> </div>
> </div>
> </div>
> As closure way below your actual <div id's>
> What did that one close....

If you use a decent editor to write your code, it will probably allow 
you to highlight which </div> applies to which <div>
Or you can do what people have been doing for years, and indent your 
nests so that the start and end of each one are at their own indent levels

<div>
    <div>
    </div>
</div>

Or comment them..


<div><!-- start of div1 -->
    <div><!-- start of div2 -->
    </div><!-- end of div2 -->
</div><!-- end of div1 -->


There are many programming conventions that have arisen precisely to 
meet the problem you have elucidated.


-- 
A lie can travel halfway around the world while the truth is putting on 
its shoes.

[toc] | [prev] | [next] | [standalone]


#40433

FromJonas Thörnvall <jonas.thornvall@gmail.com>
Date2021-09-25 05:13 -0700
Message-ID<fa2634f9-4992-416c-aead-01b88efc08a7n@googlegroups.com>
In reply to#40429
lördag 25 september 2021 kl. 10:50:52 UTC+2 skrev The Natural Philosopher:
> On 24/09/2021 19:38, Jonas Thörnvall wrote: 
> > By the way what the fuck have 
> > const video = document.getElementById("videoplayer"); 
> > 
> > const element = document.getElementById("videoframe"); 
> > 
> > To do with it, you people just so convoluted in drivel to swallow any shit you learned.
> No, they are references to bits of code that I didn't post up. I assumed 
> you would understand that. 
> 
> In fact I assumed you understood basic CSS HTML and javascript. 
> It seems I was wrong, I apologise., 
> 
> -- 
> How fortunate for governments that the people they administer don't think. 
> 
> Adolf Hitler
This is how you solve things "clear, concise and compact" watch and learn ;)
Convoluted shit gone.
<script>
function getResolution() {
    dispWidth=screen.width;
	dispHeight=screen.height;
    }
	getResolution();
       xScale=dispWidth/1920;
	yScale=dispHeight/1080;
	resString="<style>html {transform: scale("+xScale+","+yScale");}</style>";
	document.getElementById("resolution").innerHTML=resString;
</script>

[toc] | [prev] | [next] | [standalone]


#40434

FromJonas Thörnvall <jonas.thornvall@gmail.com>
Date2021-09-25 05:18 -0700
Message-ID<9256767a-be62-42f2-baf1-7766b5982073n@googlegroups.com>
In reply to#40433
lördag 25 september 2021 kl. 14:13:19 UTC+2 skrev Jonas Thörnvall:
> lördag 25 september 2021 kl. 10:50:52 UTC+2 skrev The Natural Philosopher: 
> > On 24/09/2021 19:38, Jonas Thörnvall wrote: 
> > > By the way what the fuck have 
> > > const video = document.getElementById("videoplayer"); 
> > > 
> > > const element = document.getElementById("videoframe"); 
> > > 
> > > To do with it, you people just so convoluted in drivel to swallow any shit you learned. 
> > No, they are references to bits of code that I didn't post up. I assumed 
> > you would understand that. 
> > 
> > In fact I assumed you understood basic CSS HTML and javascript. 
> > It seems I was wrong, I apologise., 
> > 
> > -- 
> > How fortunate for governments that the people they administer don't think. 
> > 
> > Adolf Hitler
> This is how you solve things "clear, concise and compact" watch and learn ;) 
> Convoluted shit gone.
> <script> 
> function getResolution() { 
> dispWidth=screen.width; 
> dispHeight=screen.height; 
> } 
> getResolution();
> xScale=dispWidth/1920; 
> yScale=dispHeight/1080; 
> resString="<style>html {transform: scale("+xScale+","+yScale");}</style>"; 
> document.getElementById("resolution").innerHTML=resString; 
> </script>
Honestly i think i am border genius LoL

[toc] | [prev] | [next] | [standalone]


#40435

FromJonas Thörnvall <jonas.thornvall@gmail.com>
Date2021-09-25 05:19 -0700
Message-ID<e550e6c7-692d-4817-a933-0c2fa34f5753n@googlegroups.com>
In reply to#40433
lördag 25 september 2021 kl. 14:13:19 UTC+2 skrev Jonas Thörnvall:
> lördag 25 september 2021 kl. 10:50:52 UTC+2 skrev The Natural Philosopher: 
> > On 24/09/2021 19:38, Jonas Thörnvall wrote: 
> > > By the way what the fuck have 
> > > const video = document.getElementById("videoplayer"); 
> > > 
> > > const element = document.getElementById("videoframe"); 
> > > 
> > > To do with it, you people just so convoluted in drivel to swallow any shit you learned. 
> > No, they are references to bits of code that I didn't post up. I assumed 
> > you would understand that. 
> > 
> > In fact I assumed you understood basic CSS HTML and javascript. 
> > It seems I was wrong, I apologise., 
> > 
> > -- 
> > How fortunate for governments that the people they administer don't think. 
> > 
> > Adolf Hitler
> This is how you solve things "clear, concise and compact" watch and learn ;) 
> Convoluted shit gone.
> <script> 
> function getResolution() { 
> dispWidth=screen.width; 
> dispHeight=screen.height; 
> } 
> getResolution();
> xScale=dispWidth/1920; 
> yScale=dispHeight/1080; 
> resString="<style>html {transform: scale("+xScale+","+yScale");}</style>"; 
> document.getElementById("resolution").innerHTML=resString; 
> </script>
And it works ;)

[toc] | [prev] | [next] | [standalone]


#40436

FromJonas Thörnvall <jonas.thornvall@gmail.com>
Date2021-09-25 05:21 -0700
Message-ID<b01b4016-9d82-4225-afe6-61edf889c665n@googlegroups.com>
In reply to#40435
lördag 25 september 2021 kl. 14:19:26 UTC+2 skrev Jonas Thörnvall:
> lördag 25 september 2021 kl. 14:13:19 UTC+2 skrev Jonas Thörnvall:
> > lördag 25 september 2021 kl. 10:50:52 UTC+2 skrev The Natural Philosopher: 
> > > On 24/09/2021 19:38, Jonas Thörnvall wrote: 
> > > > By the way what the fuck have 
> > > > const video = document.getElementById("videoplayer"); 
> > > > 
> > > > const element = document.getElementById("videoframe"); 
> > > > 
> > > > To do with it, you people just so convoluted in drivel to swallow any shit you learned. 
> > > No, they are references to bits of code that I didn't post up. I assumed 
> > > you would understand that. 
> > > 
> > > In fact I assumed you understood basic CSS HTML and javascript. 
> > > It seems I was wrong, I apologise., 
> > > 
> > > -- 
> > > How fortunate for governments that the people they administer don't think. 
> > > 
> > > Adolf Hitler 
> > This is how you solve things "clear, concise and compact" watch and learn ;) 
> > Convoluted shit gone. 
> > <script> 
> > function getResolution() { 
> > dispWidth=screen.width; 
> > dispHeight=screen.height; 
> > } 
> > getResolution(); 
> > xScale=dispWidth/1920; 
> > yScale=dispHeight/1080; 
> > resString="<style>html {transform: scale("+xScale+","+yScale");}</style>"; 
> > document.getElementById("resolution").innerHTML=resString; 
> > </script>
> And it works ;)
https://www.youtube.com/watch?v=1qNeGSJaQ9Q

[toc] | [prev] | [next] | [standalone]


#40437

FromJonas Thörnvall <jonas.thornvall@gmail.com>
Date2021-09-25 05:22 -0700
Message-ID<18ce9376-1b12-4756-8860-c40d32cfe78dn@googlegroups.com>
In reply to#40435
lördag 25 september 2021 kl. 14:19:26 UTC+2 skrev Jonas Thörnvall:
> lördag 25 september 2021 kl. 14:13:19 UTC+2 skrev Jonas Thörnvall:
> > lördag 25 september 2021 kl. 10:50:52 UTC+2 skrev The Natural Philosopher: 
> > > On 24/09/2021 19:38, Jonas Thörnvall wrote: 
> > > > By the way what the fuck have 
> > > > const video = document.getElementById("videoplayer"); 
> > > > 
> > > > const element = document.getElementById("videoframe"); 
> > > > 
> > > > To do with it, you people just so convoluted in drivel to swallow any shit you learned. 
> > > No, they are references to bits of code that I didn't post up. I assumed 
> > > you would understand that. 
> > > 
> > > In fact I assumed you understood basic CSS HTML and javascript. 
> > > It seems I was wrong, I apologise., 
> > > 
> > > -- 
> > > How fortunate for governments that the people they administer don't think. 
> > > 
> > > Adolf Hitler 
> > This is how you solve things "clear, concise and compact" watch and learn ;) 
> > Convoluted shit gone. 
> > <script> 
> > function getResolution() { 
> > dispWidth=screen.width; 
> > dispHeight=screen.height; 
> > } 
> > getResolution(); 
> > xScale=dispWidth/1920; 
> > yScale=dispHeight/1080; 
> > resString="<style>html {transform: scale("+xScale+","+yScale");}</style>"; 
> > document.getElementById("resolution").innerHTML=resString; 
> > </script>
> And it works ;)
Thanks again Igor!, oh Arnold.

[toc] | [prev] | [standalone]


Page 2 of 2 — ← Prev page 1 [2]

Back to top | Article view | comp.lang.javascript


csiph-web