What is this Mini navigation? - javascript

I am looking way of developing this "mini web page navigation" (at bottom right corner of the image). Quite frankly, I have no idea of how to search for this kind of feature. I am almost sure I could build it from scratch, but I would like to have some inspirations.
Can someone tell me how to search about this feature?

It's probably https://larsjung.de/pagemap/ and it's usually called minimap
You should try to read the source code of the website before asking the question.

Related

How can I build a responsive tiled photo gallery using JS?

So, I'm trying to get started conceptualizing a project for a friend of mine and I've run into a sort of problem right away.
They're wanting to do a photography website, which isn't a big deal, but I'm not sure how to go about replicating the functionality they're seeking for their front page.
This link is an example they gave me. They're looking to have a sort of "tile" setup of images from a gallery/folder that cleanly line up along the edges of the page (if possible) and are also responsive, so when you reach certain breakpoints, the images obviously shift to have less in each row, but still keep the same clean look.
http://www.amishakpatel.com
I figure it's probably possible to do this with various client-side JS libraries, but I'm out of practice and didn't know where to turn.
Any suggestions would be fantastic, I get the feeling that this specific part of this project is going to be more complex that I originally thought, and I'm not SUPER experienced in the art of writing responsive layouts, but I wanted to give this a shot and get better at it.
My original plan was to develop this thing as a WP website/theme, but now I'm almost wondering if due to the nature of the project that I should maybe just use WP for the backend and content management, then do the front-end separately using front-end that I'm a bit more comfortable with (React) as it's looking like the whole project will be heavy in JS anyway to do the stuff they're wanting to eventually do.
Thanks in advance for any suggestions!
After reading the advice given by the few folks who commented, I did some digging with Mosaic/Masonry layouts, and found this:
https://www.imagely.com/wordpress-gallery-plugin/
I'm gonna give this a shot, which lets me stick with WP for a platform for ease of use, keeping the whole project simple.
Thanks a lot, folks! I figured there was PROBABLY a word for what I was looking for in terms of layout, but didn't know what to Google. :P

Weather App Hourly Scroll Effect

I see in a few places that people are looking for the weather app effect. A lot of those questions are for android apps or JAVA, but I'm looking for the use on an HTML/CSS/Javascript site. Is this even possible?
I'm specifically looking for the finger/cursor scroll effect when you look at the hourly forecast.
Pointing me in ay direction would really help.
Even if I have to dig into another language like Ruby on Rails, that would be helpful to know.
Thanks.
Based on your comment, if you wish to implement a feature where the user can swipe left or right between images or areas then you should consider looking at a framework like Hammer.js http://hammerjs.github.io/ or Zingchart https://zingchart.github.io/zingtouch/.
These are Javascript library's that allow you to implement gesture functionality to a website.

How to make a Javascript/jQuery/HTML animated stack of images

I want to make a javascript/jQuery/HTML based image viewer which is sort of a cross between a book page flip and an iTunes coverflow interface without the left side of either, which would work on mobile device browsers.
I've been looking for tutorials which I can use as a starting point, but I haven't been able to find anything yet. Can anybody offer some advice on how to get started on this project? I would like to be able to come up with a rough mock up pretty quickly so it would be helpful to be able to re-use code from a tutorial or existing open-source project.
What about pagePiling.js plugin?
It creates a stack of pages and on it you can add images if you want, just like in this example.
And of course, you can use it horizontally if you prefer.

How to prevent window-resizing affects your elements

Okaay, ive been dealing with this problem for quite some time now, and i really need to get an answer now :D The problem is, when im resizing the window, all my elements just messes up. When i try resize other websites(could be anyone; facebook, twitter, even stackoverflow) it does NOT harm any elements. The view just get smaller. How do i do this?
General answer in a general tone:
Conduct some research on responsive web design practice. Learning about different types of layouts (Flexible, full responsive etc.) will certainly help understand the possibilities you have with only CSS and HTML. At least discovering this knowledge will enable you to speak more closely with your developer and head in the right direction.
Cheers!
LaddtheImpaler

Using HTML/JS or another web solution to render a twirling ribbon

Any thoughts on creating a fluid/flowing ribbon for a website effect?
I'm open to any ideas. Ideally I could do this simply with html and some js library, but I'm open to suggestions for doing this with flash also. Any links to tutorials or examples would be greatly appreciated as well.
Thoughts?
Processing.js is a popular JavaScript animation library which is a port of the Processing visualization language. There are some pretty impressive demos on the site, including this one of a snake which follows your mouse. I could imagine taking that and modifying it to be a twirling ribbon. Also, check out HasCanvas for 350+ more demos - I'm betting that someone has made something similar to what you're looking for - here is kind of a neat ribbon-y effect I saw on the first page.

Categories