I am using the vue-masonry library. At first I have 6 items, so I crated a LoadMore Button to see more of them. The problem is, that when I am in mobile, the items load perfectly, but the viewport changes. see the image attached.
Is there something I can do, to prevent the scrolling movement?
Related
I have a bunch of images, say 100 images, in a web page, and only 10 are visible without scrolling the page. The first 90 images have a "myclass" class.
I manage all images with jquery lazy (http://jquery.eisbehr.de/lazy/), and it works perfecty if I scroll the window.
However, If I make $(".myclass").hide() before scrolling down, I see the last 10 images, which don't have the "myclass" class, bug jquery lazy doesn't "reveal" them.
Why?
Because lazyload triggers on scroll events.
$(window).scroll() (which triggers the scroll event on the window) is enough to solve the issue.
If the scrollable div is not the window object, use it instead of $(window).
A am developing a list based app, wherein I am tryin to use iScroll5 to implement lot of animations and smooth scrolling functions. I would like to do lazy loading of my contents wherein I want to load first 50 list elements to DOM and based on user scroll event asynchronously bind the next set of list elements to the DOM.
Am I on the right track to go with the iScroll5 - Infinite scrolling API or is there any other library which does the job for me ?
If you want to use infinite scrolling , means on page load some content are pre load and then user scroll down and other content are load on scroll with lazy loging, if i am understan right then please try to use jscroll jquery plugin.. it's very good for infinite scroll.
http://jscroll.com/ you can find here document and example of this plugin.
Regards,
vinit
I want to make a dynamic animated slider with symbols that contain clickable actions vs a slider image only approach. I would like to use a "next" button and a "back" button that will scroll multiple background images that contain clickable links. I can produce a basic image slider with the back and next buttons, but this approach is limited. Any help on how I can do this in Edge Animate CC will be very appreciated.
I was looking for a very simple slideshow a while ago. Came up with this here:
http://jquery.malsup.com/cycle/
If you want your Slides to contain any clickable items you will be able to simply add them to the sides div. Just set the picture as a background image in CSS and you are free to develop any clickable items infront.
Here is another tutorial that worked fine for me: http://line25.com/tutorials/build-a-simple-image-slideshow-with-jquery-cycle
To me this is easy to understand and if you are used to jQuery at least a little bit this here will work out fine for you.
I am developing a windows 8 app using JavaScript & HTML.
I have a page which has different sections laid horizontally. I have links for these sections in another page. I want the page to load from that specific section (meaning page should start from this section).
I am using a grid template and have a listview in the main page. When i click on any item in a group ,navigate to that page and come back to the main page. I want the main screen to load from the section that i have selected before.The screen should automatically scroll to that section like how it is happening from semantic zoom.
Any help in this regard will be of great use.
Thanks
For the first part, it should be enough to set the scrollLeft property of the container to the offsetLeft property of the element you want to scroll to.
The second part can be achieved by storing the scrollPosition attribute of the ListView before navigating away and setting it to its old value after navigating back.
As Ma_li said, scroll-left is one solution -- especially for non ListView content. The key here is how much of the experience you want to maintain when navigating back. One option (again, for non-listview content) is to find the element you want to be onscreen, and calling scrollIntoView on the element. However, this only brings the item on screen -- it won't bring it all the way to the left (or right, for BIDI languages), it scrolls just enough to et the whole element on screen.
For ListViews, you should use the indexOfFirstVisibleItem (or, indexOfLastVisibleItem) to scroll the listview to the correct location. This is key, because the listview is a virtualized control, this provides the most accurate & reliable method for scrolling the listview position.
Thanks Dominic & ma_il
I tried document.getElementBy("Id").focus() for the 1st Question and it worked. But i am getting a problem in this.
I have four divs Horizontally say "divA divB divC divD"
Data for the divA is coming from cloud. When i click on the link for divD in the main screen. it is not taking me to the corresponding section for the first time as it takes some time to load the divA. when click on the link for divD second time, it takes to the respective section. It is working if i use setInterval() but the DivA is shown for few seconds when the page loads and then scrolls to divD which is not good.
i create item details page divided to 3 rows ,i put scrollviewer in row no 2, scrollview contains two pargraph and webview ,when i scroll the page ,webview appear on the row no 3 means that it ovelay row no 3
WebView suffers from an airspace issue. as it is not hosted in the same render target as the rest of the app, but rather in a separate HWND window. There is currently no good way around that other than manually resizing the WebView to make it fit in your boundaries.
You can use a WebViewBrush instead of the WebView, but that has a set of limitations of its own - basically it is just a non-interactive brush. Its documentation shows how you can use it to temporarily show the non-interactive page while some other content is rendered on top of it.
Or, if you only want to display a Web page, WebViewBrush may be able to be used.
official sample code: XAML WebView control sample - ScenarioInput4.ComboBox1_DropDownOpened()