I'm trying to scroll to a component like an html anchor does. The method UI.getCurrent().scrollIntoView(component) scrolls to the right component. But the component is shown at the bottom. I would like to show it at the top (line an html anchor does). Is there a way to do this in vaadin?
GWT has the component Anchor. But it is not availble in vaadin. Any idea?
Related
I am working on an Angular single page application. I have a navbar. I am using fragments to jump to section and anchorScrolling is enabled.
How should I scroll to a specific section when refreshing the page and when the URL contains the hash fragments? xx/#sectionToJUmp.
I have tried scrollIntoView, in the ngAfterViewINit(), but it's not working. The specific section is in a position, but it goes down when other sections are loaded. The scroll remains in the before position. How to get it in the specific section position? Thank you
When I am placing the jQuery selectmenu inside a div that has a CSS property overflow: scroll and is smaller then its content, then the dropdown menu is not following the scrolling inside the overflown div.
See the example here
https://codepen.io/Nighel123/pen/gZeQVd?editors=1000
I have found a way to fix it with this code:
$(".demo").scroll(function(){
$( "#salutation" ).selectmenu( "open" );
});
But I think this is not the best way to fix the problem since the dropdown does not seem to follow the select element precisely when I am trying the code on my computer. Additionally the dropdown menu opens when I am scrolling inside the overflown div, what is also not the expected behavior of a dropdown.
I also tried to trigger the scroll event of the window object, when the overflown div gets scrolled to fire the positioning methods of the jQuery dropdown menu. But this did not work at all.
I would like to follow the dropdown menu follow my select item more precisely with the scrolling of the overflown div. And maybe also get some less ugly hack compared to what I did above.
I found a solution with the appendTo method of the jQuery-UI selectmenu. Just append the dropdown menu to the div that is being scrolled and it works!
Is there any way to use tool tips, but instead of text, put some component in it, like a datatable, label, panel or similar?
Somthing like this, but with a component instead of text.
You could use jQuery UI Tooltip with custom content.
You could place the markup you want to have in the tooltip in your output html, hide it in CSS and reference it in the jquery ui tooltip.
I'd like to implement a Facebook like control for auto loading of a paged content into a DIV with custom styled scrollbars. For custom scrollbars I use jScrollPane plugin, but can't figure out how to listen to an event when this scrollbar reaches its bottom to append additional html to this DIV. Any hint?
Listen for the jsp-scroll-y event and check the passed isAtBottom flag in your event handler. Details and demo here.
I want a modal popup effect to display dynamic content on a single page. I'm working with Telerik controls. Telerik has a control called RadWindow which is more or less a modal window.
It looks like the only content that is to be displayed in RadWindow is the content of a page that is specified in NavigateURL. That is a problem for me because what I want to display is the dynamic content that I show on the same page.
Is it possible to display content that is on the same page using RadWindow?
The RadWindow is an iframe. It has to have a separate page to render, unless you use the clientside radalert and radconfirm methods--you can pass in HTML for an alert or confirm dialog that doesn't require a separate page. That doesn't sound like what you want. Consider using the RadToolTip or the AjaxToolkit ModalPopupExtender instead.
RadDock does what RadWindow does. Only, it takes input from the current page instead of from an external URL.
For some time, RadWindow can display content from the main page as well. Here is a link to the demo:
http://demos.telerik.com/aspnet-ajax/window/examples/internalcontent/defaultcs.aspx