Issue
I’m trying to implement some scroll based animation in my Dart web application using Skrollr.js. So far I have the following in main():
main() {
ScriptElement script = new ScriptElement()
..type = 'application/javascript'
..src = 'skrollr.min.js';
document.body.children.add(script);
ScriptElement script2 = new ScriptElement()
..type = 'application/javascript'
..innerHtml = 'var s = skrollr.init({forceHeight: false});';
document.body.children.add(script2);
js.context.callMethod('skrollr', ['init({forceHeight: false})']);
}
For some reason I’m getting the following errors when run:
Uncaught ReferenceError: skrollr is not defined and
Exception: NoSuchMethodError: method not found: 'skrollr'
skroller.min.js has been placed in the app next to index.html so I’m looking for help on what is wrong here.
Also if the is a pure Dart alternative for scroll based animations I’d be happy to know of that as well.
Thanks in advance.
Solution
just use:
import 'dart:js';
void main() {
void keyframe(element, name, direction) {
}
context['skrollr'].callMethod('init', [{'keyframe': keyframe}]);
}
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>skrollr</title>
<script type="text/javascript" src="skrollr.min.js"></script>
</head>
<body>
<script type="application/dart" src="main.dart"></script>
<script data-pub-inline src="packages/browser/dart.js"></script>
</body>
</html>
this works. no problem with it.
Answered By – Robert
Answer Checked By – Willingham (FlutterFixes Volunteer)