I want to achieve this behavior with Slick carousel:
always shows one element in the middle
the last element shows up in the middle as well
first element
elements between
last element
Related
I have multiple tablixes that are rendered individually on each Excel worksheet when exported. However, I need the position of the tablixes to remain the same throughout all the different sheets, because currently, from the second sheet onwards, the tablix is not in the same position as the first one.
Please help!
What I have done in the past:
You should create the tablix objects with a fixed height and width for better use of assignment.
You should be altering it more on the 'Properties' pane than trying to use the mouse for fixed positions to be more precise. Set the 'tablix' object of my first one and select 'Size' to be 3in, 0.75in for 3 inch width and 0.75 in height.
I would set the 'Location' for the first to 0in,0in. Then using a similar method as 2 for setting a fixed size, start you next one at 0in,(height of first)in. So in my case it would be 0in,0.75in for the next one.
Set the 'PageBreak' > 'BreakLocation' to be 'End' for the first one and every other object you need to break onto a new page. You should NOT do this for the last object as you could generate a blank final page potentially.
Optional:
You can name the pages as well that appear under 'PageName' as this names the sheet in Excel as well.
Treat your report template as a Cartesian plane, with origin on top left corner with positive y-axis in the "down" direction. Ensure that your charts/graphs/tables are of the same dimension and placed at equidistant points within your plane. E.g. If you have two charts both 2 inches by 2 inches and your report template is 4 inches by 4 inches, then your first chart will be at (0,0) and your 2nd will be at (0,2). Keep this in mind and you will not falter, god-speed!
The problem
Today's modern websites may use infinite scrolling technique to replace paged lists to make a more seamless experience to their users.
This is all nice and dandy as long as users don't scroll to far down which means that your document becomes very complex with huge amounts of DOM nodes. There are of course ways to mitigate this problem (i.e. replacing over-top overflowed scrolled elements with a single DIV of appropriate height for example), but they're either complex to implement and they still have their flaws.
The idea
I was thinking if anyone has already seen an implementation where items, that get scrolled out (top or bottom) somehow become smaller and fainter until they disappear and get replaced by its adjacent item.
I'm thinking of a mix of experience of:
scrolling
fading
scaling
Fading and scaling can be seen on Medium.com when you get to the bottom of any article and you click the next recommended one displayed below (click the title). When you do click and if you pay attention you can see the effect of original article disappearing while being replaced by an up-sliding new article.
Content scrolling could be done in this way and infinite scrolling would be much smoother and less resource consuming as elements would get replaced on the fly and in-place.
Number of simultaneously displayed items of course depends on items' size. In case of Medium-line articles it would likely be one article that would also scroll until you'd scroll it to the very bottom (or top). In case of posts like Facebook, it would be many more items simultaneously as they don't take as much vertical space.
Coverflow works in somewhat similar way as it displays middle content completely and rest is either hidden or scaled/transformed.
The question
Has anybody seen such an implementation on the web? If done properly it would actually make a much nicer infinite scrolling experience without hogging our browsers.
But to make my question more clear and non-debatable. Can you provide a working (albeit simplified) example of such experience?
Requirements:
when an item gets scrolled out it disappears (using fade/scale/both)
when items appear at the bottom (or top when scrolled up) they should display in the opposite to scrolled out items
pressing usual scrolling buttons Home, End, Page Up, Page Down and Space should work.
invisible items should be removed from DOM
scrolling should somehow be available using some sort of scrollbar as well
I think I might have found what you were looking for.
http://engineering.linkedin.com/linkedin-ipad-5-techniques-smooth-infinite-scrolling-html5
Is there a simple way of reordering (sending to top) the exiting DOM elements before removing?
The reason I want to do this is that there is no other z-index rendering order other than DOM order.
I want my exiting elements to be covered by entering and updating elements. If they are moved upwards in the DOM they will be covered by elements below.
For entering elements this is of course not a problem since I simply append them to the bottom or insert them like .insert("g",":first-child") to get them on top.
Optionally I could move the updating and entering elements down. If that is easier.
But how do I move elements?
I want to create a photo gallery basically.
I have a list of x items, and a pivot of 3 pages fixed.
(I did this because I don't know in advance will I have 4 items or 1000)
When I'm browsing between the items and I reach the last one, I want to disable further paging to the right, or to the left if I reached the begining.
Is this possible, and how?
Thanks in advance.
You can use my answer here to determine when the user is on the first or last pivot item. Once you reach the the first or last pivot page, you can then disable the hit testing by using IsHitTestVisible=false as described on this page. To ensure that you can still swipe in the opposite direction, you can detect a horizontal swipe to the left to re-enable it and then manually move the pivot using SelectedIndex.
There are various ways of detecting a horizontal swipe such as using the gesture library or calculating it manually. You can get the starting position and the final position of the user's touch and determine if the difference in the X positions is positive (swiped to the right) or negative (swiped to the left) - assuming you're subtracting the initial position from the final one.
Is there a standard Aqua way to handle a practically infinite document?
For example, imagine a level editor for a tile-based game. The level has no preset size (though it's technically limited by NSInteger's size); tiles can be placed anywhere on the grid. Is there a standard interface for scrolling through such a document?
I can't simply limit the scrolling to areas that already have tiles, because the user needs to be able to add tiles outside that boundary. Arbitrarily creating a level size, even if it's easily changeable by the user, doesn't seem ideal either.
Has anyone seen an application that deals with this problem?
One option is to essentially dynamically expand the area as the user scrolls through it - any time the user scrolls within X units of an edge, add another unit in that direction. Essentially, you'll never be able to scroll "all the way" to an edge, because the closer you get the farther it will expand.
If the user scrolls back away from the edge, contract it to back to no more than X units beyond where there is actually content.
Have you seen what Microsoft Excel does for this problem? It has to represent an unbounded space with scrollbars, as well.
One solution is to define a reasonable space for the original level size, and when the user scrolls to one tile away from its bounds, add another row or column of tiles, and adjust the scrollbar accordingly. This way, the user never reaches the actual bounds.
If the user decides to cut down on the level size, you could also add code that shrinks the "reasonable space" once an unused row consists only of empty tiles. This saves the user from being stuck with a huge level that they scrolled through, with no way to shrink it.
Edit: Same as Dav's answer. :)