How to create popup windows in html - html

I want to know how the pop up windows integrated into websites are built. I am trying to create one for my websites but i don't really know it is created whether they are plugins or not. Any help as to how to go about it.
Below is an example of what i want to do.

You can use hotjar.com to put a feedback box in your page, there is a lot of services that provides this feature, but hotjar gets the job done

Beginner! To make a pop-up like the one you provided, you would need to write backend code (Node.JS, PHP, Python, etc.). But for just a simple info pop-up with a button that activates the pop-up refer to this jsfiddle I created:
https://jsfiddle.net/d706dyg7/1/
$("#whateverid").click(function(){
//whatever code
});
That mean when that element is clicked blah happens.
Hope that helps,
Ben A.K.A BlackSky
P.S. If you want a solution in pure javascript and not jQuery just let me know and I will edit my fiddle!

I know I'm like .. 10 years late. But for anyone still wondering I thought I could be of some help!
If you want to do this using ONLY html and css (using a framework in visual studio like ASP.NET) for example.. here's what I did:
First, I made sure I had multiple "divs" in my code. For me specifically, I had two main ones. The first one whose id="main", and another whose id="popup" with the 'visible' property initially set to 'false' for the popup div.
Then, on whichever event you're looking for (button click for example) you'll simply set main.Visible = false and popup.Visible = true, then you could have more buttons in your popup (yes, no, cancel, confirm, etc.) which do the exact same thing, but in reverse!
The most important thing to make sure of is that you have the 'runat="server"' property in your divs so that you can access them in your CS code
Hope this was helpful! :)

Your looking for something called a modal. Depending how you wrote your HTML there are different ways of approaching this issue.
If your wrote your website in Plain HTML you can use the following tutorial to create one
www.webdesignerdepot.com/2012/10/creating-a-modal-window-with-html5-and-css3/amp/
However if you wrote your website with a library such as Bootstrap they have built in pre made modules that you can attach to your cpde. These can Ben found in the library's documentation.

Related

AngularJS Dynamically adding and removing HTML

Hi I'm trying to create a website where depending on what button is pressed, it will load HTML in a container corresponding to that button without having to reload the page. I was hoping someone could point me in the right direction to where I can learn how to do this. Thanks
This can be done easily with the Angular UI Router.
This page has a demo that (I think) does what you want:
https://ui-router.github.io/tutorial/ng1/helloworld
There may be some studying required to master this :)

Content Dialog template in Visual Studio C#

I'm starting to learn Windows 8.1 phone development and I am trying to get the Content Dialog template to work inside a Pivot page. Work some reason, when I try to get the Add app bar button to navigate to the ContentDialog.xaml page, it is not displaying, but I see the navigate go to the ContentDialog constructor where the this.InitializeComponent() occurs.
I am finding very little online in way of examples on this template, so I am at a loss as to what I am missing. I understand that the ContentDialog page that was created from the template is inheriting from ContentDialog and not Page, but I'm not sure if this is still supposed to be directly accessed or if this XAML is supposed to be inside another "Page" XAML file.
Can someone please help.
The code looks like this in the Pivot page when the click event is selected:
Frame.Navigate(typeof(ContentDialog1));
I really haven't even touched the ContentDialog template from it's default yet, so it is set up like a set password page.
Thanks in advance
UPDATE
I found the answer to my question above. apparently, because it is a Content control, it needs to be called like a normal dialog would need to be called in it's code behind. I think my missconseption was that I thought it being "a template", that when I called it with the navigation calls that it would already have everything needed to get fired. You can also add the Content control to an existing page if you would like.
In either scenario, you need to add a method similar to this in your XAML.CS file.
private async void OpenDialog()
{
await this.contentStuff.ShowAsync();
}
You then need to call this method in the constructor. Then, when called, your dialog will appear.
Hope this helps others just starting out.

Adding a interactive gui to my VB.net application

OK. So first, I will try my best to explain so good. My friend has gotten cursed out on this forum for not explaining, so I will explain. :)
Ok so I have my program built and all. But then it hit me! Wouldn't it be better to add a news feature? One teeny tiny problem? I cant? How would I implement a interactive code into an HTML page.
Like can i connect a button to a URL that will make the program do something. Almost like you can open cydia tweaks with there identifier and url EXAMPLE: http://handleopenurl.com/scheme/cydia And then i can add urls so i can update the program, without updating the files.
Or even just a featured news thing would be nice. But how would i implement this perfectly. I tryed a webrowser, but the page is too big for it. I am good at html, not much at css, i mostly use Adobe Muse http://www.adobe.com/Muse
Last question. Kinda defies the first thing i said about having my program finished.
Is there a way i can add a plus button and make it add more buttons and more labels and all?
This would help with allowing users to customize more then what the program can handle. By The Way, its a winter board Theme Maker. So I have a bunch of icons with there bundle identifiers and I create the folders with VB.net and all that stuff. But i want users to be able to click a plus button to add MORE text boxes and file browsers.
Any ideas? Maybe DIM 1 as NewFileBrowser? But i need to move all the buttons and i need it to be able to be clicked an infinity amount of times. I can do the coding for all of these buttons, but i jest need to know how to create them <1 Move them and the button so that the button goes further down each time, and more boxes will go further down. Much help apreciated. THANKS:)
EDIT:
Are you trying to say that you're wondering how to have a web browser control in a vb.net >app, which displays a web page, and when a button is clicked on the page, your app detects >it and does something? – Thraka
That sums up the top part. I am using windows forms, and it is coded in VB.net
If you get the object you want, like the button, you can hook the event and have it call code in your form.
Find the object using the Browser.Document.GetElementById method.
With that object, add an event handler to the Click event.
See http://msdn.microsoft.com/en-us/library/system.windows.forms.htmlelementeventhandler(v=vs.110).aspx for information about the event handler used

Selenium does not record Ajax Call. Need help on coding in html or selenese

I am recording a .Net application using Selenium IDE. Theres this scenario, that a textbox is presnt. I need to enter a name to search. As soon as i start typing, matching options come in a dropdown below. I have to select one of them, then the application goes to the next page.
The problem is, Selenium doesnt record this selection from the drop down. More over, when the script is typing in the name, the dropdown list is not being visible at all.. i.e. the ajax call is not occuring.
Please help. I need the solution code in Selenese or HTML, since I'm not much of a coder myself, and also, I am simply recording and playback, so I am not using Java or other scripts.
This question is great,
and so is the answer in this blog: http://blog.buberel.org/2010/07/howto-test-jquery-ajax-autocomplete-menus-with-selenium.html
other option to deal with this problem is to use a different way to insert your text into the text box, as described here: Can selenium handle autocomplete?

Visual Basic - Autoclicker that doesn't use the cursor

So what I'm trying to make is something like this:
1).exe file has a web browser
2)web browser directs you to a button
3)i use the code "Dim elements = WebBrowser1.Document.GetElementById("nupuke420_kitchen")" to focus on the button
But that code was all i found from research. Can anyone please guide me on how do I actually make my program click on it every 3 milliseconds? Thank you
The answer is: "elements.InvokeMember("click")