javascript no working in <ons-template>

[memo]

i want use javascript in many page but it working only insid <ons-navigator> tag and dont working insid <ons-template>
you can see my live example (https://jsfiddle.net/memohmtl/jkuLswmw/ )and give me solition pleas
in the example whene i scroll dwon i want show px position bu he working only in <ons-navigator>

[munsterlander]

@memo Try to envision your application as a single page website. All your JS should be located in one area, i.e. a single script tag, a single JS file (although this can be broken up), but basically, all JS should be loaded in the index.html file first. You then check to see if the element is attached to the DOM to begin work on it and vice versa. I really recommend checking out: http://tutorial.onsen.io/

This tutorial shows several methods of that: http://tutorial.onsen.io/?framework=vanilla&category=Community tutorials&module=passing_data

[memo]

@munsterlander please run my live example and edit my example and give me ready code
about run script in <ons-template> >> I am waiting for you

[munsterlander]

@memo That is not how this works. I am not an employee of Onsen / Monaca. I am a community member like you, but more importantly, a paid developer who is available for hire. I respond a lot because I LOVE Onsen and Monaca. It makes my work very easy and I want to help others so this product stays around forever. With that, what exactly do you want to accomplish? Do you want a div to change, showing the pixel distance, as you scroll?

Edit: Also, why are you using version 1.X? Migrating to version 2.0 would provide a lot of benefits.

Edit2: Additionally, there was an almost exact question on SO with the almost exact same code you posted which was eloquently solved / answered by @IliaSky
http://stackoverflow.com/questions/39638415/outside-javascript-not-work-with-onsen-framewowrk?noredirect=1#comment66672164_39638415

[memo]

@munsterlanderi am use v1 because he have document live example … and i return my require give me code or example or anything for using javascript in <one-template> in writing do not understand or give me another framework javascrpt work in here cached page >>help me :pensive:

[memo]

@munsterlander llia sky He gave me in <ons-navigator> bu i want in <one-template> :pensive:

[munsterlander]

@memo We are here to help those who ask for it. I edited my original question, but I will restate it here, so I understand you. Do you need an example that has a label which changes automatically as you scroll and it shows the pixel distance from top?

As far as running scripts inside of ons-template files, it can’t be done in the way that you would think. Meaning, <script> blocks do not get executed. It has to be defined in your index.html page and then you can call it from your template.

So what exactly do you want to accomplish and I will see if I can throw together an example?

[memo]

@munsterlander i will explain my project : i have 100 page and i have main page … the 100 page<ons-template> in side panel and each page when i scroll i want show px … but he show only in main page(<ons-navigator>)

[IliaSky]

Oh I didn’t know that you wanted the feature in all pages - i thought it was only for a specific page. In that case you can do something like

document.addEventListener('pageinit', function(e) {
  var page = e.target;
  if (/* check whether there should be page scrolling functionality */) {
    var content = page.querySelector('.page__content');
    var horizontalScroll = page.querySelector(".horizontalScroll");
    var verticalScroll = page.querySelector(".verticalScroll");

    content.addEventListener("scroll", function(e) {
      horizontalScroll.innerHTML = "Scroll X: " + content.scrollLeft + "px";
      verticalScroll.innerHTML = "Scroll Y: " + content.scrollTop + "px";
    });
  }
});

Hint: you could use something like .onsen-sliding-menu__main to check for main content pages.

PS: My battery is dying so this is it for today.
PS2: I agree with @munsterlander - you should try to migrate to v2 - it’s much better :)