The discussion on the topic “Jump to the bottom of the page” dried up.
My key questions:
How do I implement the smoothscroller script by clicking on an object? The example provided uses a text link.
In a set of relative layouts, how do I set the target ID so that, for example, the banner in each layout has the ID of “top”?
Can you add a Hype Doc that shows what you want to achieve ?
Does the answer to your other question here resolve this?
I have already shown you how to do this:
It makes no difference where you jump, you just need to change the target using the example in the other topic, even with a downloadable example.
var target = $('#topLink');
$('html,body').animate({
scrollTop: target.offset().top
// this value sets the speed (1000 is 1 second)
}, 1000);
I added an ID to the <a> which is the target, and I added the code above to the arrow.
I have already shown you how to do this:
There are lots of disconnected bits of information here and a lot of blanks, and, in some cases, conflicting info. Frankly, it would be very helpful if Daniel or Jonathan or someone would put together a primer for how to use JS in Hype (something beyond hello world). This is like having to figure out where to plug in a formula in an advanced mathematical equation and not being clued into the secret that everyone knows but me: the answer to everything is 42.
I sincerely appreciate the effort and all the contributed info.
In the smoothScrolling example, I see that the resources pane lists three JQ libraries (jquery-2.1.2.mni.js, jquery.arbitrary-anchor.js, and jquery.easing.1.3.js - which I found by checking the container resources folder). In another smooth scrolling example, I see a single script created in Hype. One contributor said I should be able to do everything in a set of relative layouts with one script. In one example the script is triggered by a text link but not an object. In the file that Andrew so generously helped me with I see four scripts listed in the resources pane but in the head I only find the link to jquery-2.0.3.min.js.
I am trying to apply my deep (but now orphaned) understanding of Lingo to figure out how things work with JS and Hype. When it comes to working with text and objects in Hype, I want to end up understanding what's happening under the hood so that I can reproduce this in other situations. I will try to figure things out by dissecting Andrew's work on the file I provided.
I’m trying to recreate a Hype animation to work with the smoothScroller.
Background – I have created a set of responsive Hype projects that are stacked inline to create a scrolling web page. Originally, it was one tall Hype project with multiple sections. A smoothScroller script was set up with the topmost object (menu bar) as the scroll target. The trigger was a button in the bottommost object. It worked perfectly.
Due to loading speed, I broke it apart by duplicating it several times and deleting unwanted sections. When stacked inliine on a web page the scroller continued to work perfectly.
I am setting up a second page using the same target object but a different bottom object.
I have a Hype animation that is too complex to easily transfer to a clone of the original bottom object. I copied over the button, and so-on, recreated the scripts and made sure that everything was identical. I checked the head HTML verified the JS call in the button action. All element IDs are correct. But the scroller doesn’t work I’ve checked every object, every script, and I’m stumped.
Clearly my issue is with the basics somewhere. I’m missing something very simple. Any ideas?
Version that works (trigger: the Up Button):aboutusmobile.hype.zip (557.9 KB)
Version that doesn’t work:finishes.hype.zip (1.2 MB)
Trying to figure out how to make the scroller work for all breakpoints. Works great in the 900 px+ layout but not in the others.
This page uses a stack of Hype items in an inline layout. The bottom item has a button for scrolling to the top, with a separate Hype item containing the target. As the elements are disconnected and as they apply to two different Hype items, I’m having trouble figuring out what’s causing the problem. Attached are a top (target) item with the menu bar as the target and a bottom item with an “up” button. Not sure what I’m missing. I’ve tried all sorts of things, including assigning IDs, etc. I tried working with our in-house programmer to figure this out, but as he is not a JQ guy he could only make guesses with some of this stuff.
scroller.zip (1.1 MB)