I'm looking for creating a tiny popup window on a mouse click that is similar to the spotify window that contains the link and share icons. Modal windows and alert windows are in the center of the page and not what I am looking for. What I want is a small window that opens right next to the link they click on.
Any resources on the internet? I have no issues paying for resources.
I'd like it to be driven by jQuery if possible.
Thanks!
The simplest way to create this menu (that I can think of) is having the menu element inline but hidden. Then using jQuery's onclick, have the element revealed. A combination of relative and absolute positioning is used to make the menu appear to the bottom right of the menu button (this article is a great resource for explaining this trick). I've modeled the demo below from the Spotify desktop UI using these principles.
jsFiddle Demo
Related
I have to develop my video page using php which is similar to gallery with hover effects. If i hover over the video, the name of the video need to be displayed than i click the name, the video should be come as lightbox. Kindly suggest some solutions for this. I'm very struggling in this concept. Thanks in advance
PHP is a server-side scripting language, it is not suitable for "developing styles", you should use a combination of CSS and JS instead.
Lightbox - here is a complete tutorial.
At the top of my new WordPress Theme for a radio website, I want to have a DIV at the very top of the page which contains a small flash player which will play the radio stream.
I would like this DIV to be static and NOT reload every time the user changes pages. What would be the best way to accomplish this?
Please provide a working demo on jsFiddle or something like that.
I think there are two ways to keep the music going
Either you use frames, so top frame(preferably 0px height) never
change and play the music
or you can build your whole site with ajax you only change what you need to change and don't touck the player.
you can try it with ajax that you just pull the content on page change request via ajax and fill you DOM(except music player part) as per your requirement and then you need not to reload your music player.
Other wise if your music player code is the part of you http request then not one can stop it's re-loading.
I have pages with photo thumbnails, let's say the script is thumbnails.php. Each icon has a link to popup.php?id=nnn that opens in a pop-up window to display a larger image and some info.
I don't want a user going directly to domain.com/popup.php?id=nnn to get the popup small content in a whole window or tab.
So this script first checks if the referrer is the page containing the thumbnails.
If not, descrption.php?id=nnn is opened. This page is designed to fit a regular screen with extended info.
I did in this way mainly thinking in web crawlers.
Is this a good practice?
Many projects that I have worked on over the last 18 months have gone away from opening new windows or tabs altogether. Instead they use the Jquery Dialog (modal mode) to display images, html descriptions, or other attribute information.
This allows the user to stay on the same page without the risk of causing them to bounce if they accidentally close the wrong window or tab, or they just forget to go back to your site via the original window.
In my web site I have an iframe tag with several little images, when I pass my mouse (onmouseover) I show the more large image (tooltip) but only a liitle part is showed due the iframe.
There is someone that can tell me how show the tooltip into iframe over the parent page?
(without use JQuery)
Thanks a lot
I have implemented a jQuery solution for tooltips inside iframe
Here is the code:
https://github.com/TeamTypeform/Tooltip
I'm making a webpage that needs to switch between background images on a page, where the user can click on back and forth arrows to sift through each background while browsing.
For each background there needs to be a dynamic description for each image.
For example, the user may load the page and see the body background with a description for what it is, and then click on the right arrow and the background changes, along with the description for the new background.
Does anyone know of a way to implement this, or know of a plug in that already does it?
jQuery Tools, probably Tabs.
Easy to set up, lightweight, encourages good HTML, and completely customizable via CSS.
Why don't you try Supersized?
Seems to be exactly what you are -were- looking for!