I want to integrate a function into my website, whereby if a user hovers their mouse on the name of a product, a box appears which will show the details of this product. For this I would preferably like to use either CSS or Javascript, I am not really sure how I would go about doing this though. Can anyone offer me some guidance please? I am currently using the JQuery UI with essentially the same code as the shopping cart code seen here :
http://jqueryui.com/demos/droppable/#shopping-cart
Thnk you very much for the help.
If you want to be fancy and use jquery, here is a list of popup plugins that you can browse.
If the product information isn't too complicated I would suggest using CSS as it is simpler. Also, you probably want to have the data already loaded, so the user doesn't have to wait a round trip to your server every time they mouse over a product. Here is a simple CSS popup tutorial.
Related
I am learning Wordpress currently so far I know how to design the webpage, but what I want to do next is to make a product page without ordering. What I want is the following:
List all my products and if one clicks on a product it will show the detail page of that product
The products can be added to a list and then there will be a contact form which will take the list and send it to me in a pdf or excel (but at first enough if only names are sent via email) so I can answer it with the asked question.
I sadly could not find any starting point I do not even know if there is such a plugin, if not can I make one myself? I know javascript so I think I could Programm it myself but would prefer if there is some plugin I can use due to time issues.
You can also use woocommerce. If you don't want a user to order something with a "Add to cart" button you could hide this button with your code or a pluging for example https://de.wordpress.org/plugins/yith-woocommerce-catalog-mode/
I have reached a point in my project where I cannot figure out how to use Ajax to keep going. I am new to using it, but I'd like to think that I have a basic understanding of how it works.
I run a site where I take form data and post it into a database, then send it to a webpage where it displays in bubbles. Users can then click these bubbles and pop open a modal which has more detailed information than what is presented in the small bubbles initially displayed.
I've hit a wall where I don't know how to open a modal and have it live update with new information without closing, no matter what the bubble they click is (which can have different types based on different form information sent).
And to be clear, by bubble I just mean a compact div that when clicked opens the modal.
I've looked everywhere for solutions to this, trying my best to apply knowledge from other projects to what I'm trying to accomplish with to no avail. Suggestions are appreciated!
I'd suggest you to look at the load method this should be enough for what you're trying to do.
If you want a live update of your modal you have two ways to go about this:
Implement polling in AJAX. Send an AJAX request every X seconds to the server and have it update the <div>'s in your modal.
Use WebSockets. This is far more complex, and solution 1. is probably good enough.
This Stack Overflow post should help get you started: jQuery, simple polling example
I'm trying to make a bot for a website, to make purchases faster and automated. In order to do so, I am using javascript (atom) and chrome extensions. I need some help with the following things to do with chrome extension popup, which will improve the UI of my program (user interface)
1.Is there a way for the user to set a time for the code to excecute at? For example, a 24 hour clock they can edit using text boxes in the popup. Maybe this triggers a new tab which has a coutdown clock, at the end of which the code is excecuted on the website.
2.Can I create text boxes, so that the user can fill in various details such as item name and size value, that can be integrated with my main javascript code to change which product is purchased by the bot?
3.How do I create dropdown boxes for things like the category, with multiple options. Again, this must correspond with the main JS code.
4.Can I create a login page that must be filled in with a unique login before the user can access the main login page?
5.Can I create little switches?
6.Is there a way for me to customise the buttons with certain fonts, colours and sizes, and to customise the backgroud colour etc. I really want it to pop!
I know that this is a lot of questions, so please feel free to answer one or two rather thatn all of them! I have an incredibly basic understanding of HTML, so I may have some followup questions for you.
Thanks in advance,
Louis
I have a setup where I display a list of buttons and clicking on the buttons triggers a function that contacts a firebase database and gets the contents of a 'slide' that is to be shown to the user. The function then clears the content of the page and then creates elements from the data acquired from the database.
Now obviously, when I press back browser button once I've replaced the content, it won't take me back to the previous content. But I believe that my user's experience will be much better if it actually took them back to the list of buttons. I have two faint ideas on how to go about solving this problem but I'm lacking in specific details of how I can go about it.
Possible Solution 1:
Some way to dynamically create a new page using javascript and then serve it to the user.
Possible Solution 2:
Some way to simulate that the page has changed location. Maybe using anchoring links.
Let me know if you have any other solutions in mind or if you know how I should go about implementing these. Your help will be much appreciated. :D
When we want to log-out from the google/gmail account, we click on the profile picture displayed at the right most of the Google bar. The scenario with the pop-up is shown in below figure.
What does this functionality called in jQuery, HTML? I think it's not a modal pop-up as it's not appearing on the existing content of a page and background content is non-clickable. Also it can't be called as tool-tip as it's not showing up on mouse hover, we need to click on profile picture to see the log out button. So what does it called?
I'm asking this thing curiously because I need to implement same functionality in my website. That is when user clicks on specific text the pop-up/tool-tip(for now I'm using these words for your understanding only, may be I'm using wrong words). As I don't know the exact word for this functionality I'm not able to find out such jQuery plugin on internet which would behave the same way.
One more thing is that I want to use a form in this pop-up/tool-tip which would be submitted to PHP using AJAX.
Popover!
Example API from a popular CSS/JS toolkit:
http://getbootstrap.com/javascript/#popovers