How to show a pop-up box in php

hi there ,

How to create a popup box using in php. This box should appear on button click and hides automatically after a few seconds. Example is shown below . Please help :
Pop - up Box
Suneet PantProject ManagerAsked:
Who is Participating?

Improve company productivity with a Business Account.Sign Up

x
 
Chris StanyonConnect With a Mentor Commented:
Hey Suneet,

You don't show popup boxes in PHP - you do that client-side (in the browser) using javascript (probably jQuery).

Basically, the message box is a simple HTML element, such as a DIV, styled to look how you need it using CSS.

You haven't said how you want to activate the message, but a simple one-line of jQuery will give you the general idea:

$('#message').html('This is a message').fadeIn(500).delay(5000).fadeOut(500);

Open in new window


This will take an element with an ID of message, set the text, show it for 5 seconds and then hide it.

Style it with CSS - something along these lines:

#message {
   width: 400px;
   border: 1px solid green;
   position:absolute;
   top: 50px;
   background-color: #D2E9B1;
   display:none;
   padding: 10px;
}

Open in new window


If you need to do this after you've made an AJAX request, simply put the jQuery code in the .done() method.
0
 
FarWestCommented:
I believe this is HTML5, jQuery Related function
if you want to change the message from server side then you can use AJAX
check this url
http://jqueryfordesigners.com/coda-popup-bubbles.1.html
0
 
käµfm³d 👽Connect With a Mentor Commented:
You might look at toastr.js. It's built atop JQuery, and it's purpose is to creat such notifications.
0
Easily Design & Build Your Next Website

Squarespace’s all-in-one platform gives you everything you need to express yourself creatively online, whether it is with a domain, website, or online store. Get started with your free trial today, and when ready, take 10% off your first purchase with offer code 'EXPERTS'.

 
Suneet PantProject ManagerAuthor Commented:
hi I want to use this popup - when a user adds a new item in the cart. Here page will not be directed to a cart page instead on the same page a box on the upper side will appear which will say - 1 more item has added along with the small added text that will show total number of items in the cart.
This popup will hide automatically after a few seconds, allowing the user to add more item into the cart or check out.
0
 
Suneet PantProject ManagerAuthor Commented:
can anyone please help
0
 
Chris StanyonCommented:
Hey Suneet - I've already answered how to do it.

I assuming you add to your cart with an AJAX call. In the script that you call, you'll need PHP to output the information you want in the message (1 more item added and total number of items in the cart). You then need to put the code I posted into the success() or done() function of the AJAX call.

If you want to post your PHP script that adds to the cart and the jQuery code for adding to a cart, then I can take another look.
0
 
Suneet PantProject ManagerAuthor Commented:
I've requested that this question be deleted for the following reason:

My Subscription has ended so I removing my question
0
 
Chris StanyonCommented:
Suneet,

Please don't just delete question, particularly when Experts have spent the time helping. Either continue to engage with them or accept an answer.

I've offered you the code to solve your problem.
0
Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.

All Courses

From novice to tech pro — start learning today.