Closed. This question is opinion-based. It is not currently accepting answers.
Want to improve this question? Update the question so it can be answered with facts and citations by editing this post.
Closed 8 years ago.
Improve this question
I have a list of user posts on a page and there is an icon in the top right of each post. When the user hovers over the icon I want to display additional info about the post, e.g. date, time, author, etc.
I want to display the additional information in an overlay of some kind, and I'm wondering if I should use a jQuery dialog widget or just some javascript. I don't think jQuery tooltips will do the trick, because some of the details are quite long.
Some specifics:
The details should show on hover and disappear when the pointer moves away
The overlay does not need to be modal. It does not require a title bar.
It should appear at the current location of the pointer and should automatically size to fit the content
So, should I be looking at the jQuery dialog widget? Or simply a javascript solution?
Thanks..!
A temporal, non-modal dialog positioned next to the user's cursor is effectively a tooltip. I'd check out one of the more advanced jQuery tooltip plugins like qTip2. It can accomodate many different types of content (images, paragraphs, videos) and is great at scaling to fit large content.
The AJAX example on the demo page should be of particular interest to you.
Good luck!
Related
Closed. This question needs to be more focused. It is not currently accepting answers.
Want to improve this question? Update the question so it focuses on one problem only by editing this post.
Closed 7 years ago.
Improve this question
I am not sure where to start with this or even what keywords to search for, so I am asking for someone to point me in the right direction. Here is what I am wanting.
I am wanting to make a webpage that can be dragged in all directions with different HTML elements in all directions and load new elements as you get close to the edges via AJAX. I am hoping to achieve this via Bootstrap or JQuery.
Any ideas on how to get the page draggable like that?
jQuery UI has a draggable method that would work for you, as long as you target the viewable area as the element to initiallize the plugin on. If you prefer a more lightweight approach you can use this plugin created by Chris Coyier.: https://css-tricks.com/snippets/jquery/draggable-without-jquery-ui/.
An example of it working in just 2 directions would be found in this SO thread as well: Scroll the page on drag with jQuery however the actual plugin being used in the demo supports all direction dragging - see the authors site: http://davetayls.me/jquery.kinetic/
Closed. This question needs to be more focused. It is not currently accepting answers.
Want to improve this question? Update the question so it focuses on one problem only by editing this post.
Closed 7 years ago.
Improve this question
I have a php website where I use mysql as database. I want a feature like https://www.instantssl.com their bottom right corner seal.
Its showing specific info when anyone hover the mouse or click it.
I want the same feature. how can I do it?
You could create a <div> element within your page that holds the content you want displayed on mouse over. Once the mouse over event is trigger, you could then hide/show it. Things you should research:
onmouseover event
.show() jquery
.hide() jquery
These are the three basic events that you need.
Closed. This question needs to be more focused. It is not currently accepting answers.
Want to improve this question? Update the question so it focuses on one problem only by editing this post.
Closed 8 years ago.
Improve this question
I'm trying to create a site like this on WordPress where you have multiple slides (the navigation on top call the different slides) that fade in/out based on which link is clicked by the user. I'm looking for some input as to how I should go about it in an efficient way. Would I be calling these separate slides through Ajax? Should I just preload all of the images together and include them all in one html file? Advice would be appreciated.
Some questions you need to ask yourself that may impact the best way to do things.
How fast are slides going to be navigated? How "big" are the slides data-wise. How many slides are there?
If there are many, large slides it would probably be in your best interest to lazy load some of the later content.
If there are few, small slides the opposite might be true.
Closed. This question needs to be more focused. It is not currently accepting answers.
Want to improve this question? Update the question so it focuses on one problem only by editing this post.
Closed 8 years ago.
Improve this question
I would like some guidance / ideas for the following problem: How can someone lock the scrolling of a web page in order to present content to the user in a specific sequential way? For example, I would like a web page to have 3 sections, and with an onclick to scroll to a specific section id_1, then with another on click to scroll to section id_2 etc., but only with the onclicks to do that scrolling and prevent the user to scroll by himself with his mouse or with the scroll bars. Thanks!
If these are your specs you absolutely have to follow, which I highly recommend against anyway, you could just make each section stretch to fill the screen and make them fixed. Then provide a button to toggle in between the different sections.
Closed. This question needs to be more focused. It is not currently accepting answers.
Want to improve this question? Update the question so it focuses on one problem only by editing this post.
Closed 8 years ago.
Improve this question
I had a meeting with our president this morning who was wanting to have our team page function similar to the following app for her Ipad:
http://itunes.apple.com/us/app/appstream-for-ipad/id375288393?mt=8
There is a lot of movement and I am not sure where to really begin. In our case the thumbnails would be pictures of our people and when you clicked the photo a pop up box with description and contact information would be available for the user. I am wondering if anyone has seen a JQuery plugin I could use to simulate this affect or something else I could build on.
Any help would be greatly appreciated.
For anyone that is interested, here is what I wound up doing.
I used a JQuery plugin called "quicksand" for the animation part of it, then set up some an AJAX request on a timer to call a php page with a list of all employees in random order. Give a similar effect to what we were looking for, thanks for all the help.
One way i could think is to just have the thubnail images and then load the appropriate profiles in a fancy box
http://fancybox.net/
Or do it all manually, by having a hidden, absolute positioned Overlay and then present it on click