We Keep Coding

How to show button in javascript

I am making a quiz game and I was wondering how I can make the proceed button appear. it goes from the user typing the right answer, displaying a nice good jobs sort of message, then at the same time a button pops up saying that the user can proceed. could someone help?
Image Of The Code Click Here

Use these methods -
function show_button(id){
document.getElementById(id).style.display = "block";
}
function hide_button (id){
document.getElementById(id).style.display = "none";
}
if the user enters the correct answer then call
hide_button(id of the html element);
you can display messages informing that user had entered the correct answer or not by making use of javascript and accessing the CSS stuff with javascript.
document.getElementById(id).style returns you a css object.
you can modify CSS (style, margin, padding, color) of the HTML elements using javascipt to create a dynamic webpage.

If you want to use jquery the code is:
$(document).ready(function(){
var input = ("#the.id.of.your.input").val();
var result = "The result";
if(input == result){
$("#id.of.your.button").fadeIn();
// or: ("#id.of.your.button").show();
}
});

How to create click button in pure JavaScript?

how to create click button in pure/native JavaScript without using any html tag and css? This button, when the user click it there's a confirmation box will appear then, when the user click the Ok option, there's a popup window will appear.
I have already code in popup window and confirmation box. Here:
if (confirm("Go?") == true) {
popupWindow = window.open('/filename.htm', "name", windowFeatures);
popupWindow.focus();
} else {
test1= "";
}
I want to display the click button under of:
<div class="activityHeaderPanel">
But, I don't have an access or privilege to change or edit the entire html.
Please help me. I'm not really a programmer. Thank you.

var test = document.getElementByClass("activityHeaderPanel");
function whatClicked(evt) {
alert(evt.target.id);
}
test.addEventListener("click", whatClicked, false);

You can use the native DOM API to create document nodes and attach events, using pure Javascript and no HTML.
var myDiv = document.createElement('div');
myDiv.className = 'activityHeaderPanel';
myDiv.onclick = function(){
if(confirm //...
}
To attach the div you created to the existing document you need to find its parent node and use appendChild:
//this will depend on your particular use case. For example, if the parent element is a
// <div id="theParent">
var parentNode = document.getElementById('theParent');
parentNode.appendChild(myDiv);

Open page in modal box

I have a script that restrict the click on a href link if there;s no checkbox selected. I want the editpr.php open in modal box. The problem is I'm not familiar with modalbox. Any help?
<a class="button edit" style="cursor:pointer;" ><span><b>Edit Purchase Request</b></span></a>
<a class="button remove" style="cursor:pointer;" name="remove"><span><b>Remove Purchase Request</b></span></a>
This is my script
jQuery(function ($) {
$('a.button.edit, a.button.remove').click(function () {
if ($('input[name="checkbox[]"]:checked').length == 0) {
return;
}
if (!confirm('Do you want to continue?')) {
return
}
var frm = document.myform;
if ($(this).hasClass('edit')) {
frm.action = 'editpr.php';
}
if ($(this).hasClass('remove')) {}
frm.submit();
})
})

You can't open a page in a modal box just with pure javascript, as "alert()" or "confirm()".
To do what you want you need to put your 'editpr.php' content inside a div, and make it modal with CSS.
Actually we have a lot of libraries that make it happen easily, I think that most used is: http://www.jacklmoore.com/colorbox/
Check the "Outside HTML (Ajax)" and "Outside Webpage (Iframe)" on this example page, probably is the same thing that you want to do: http://www.jacklmoore.com/colorbox/example1/

There are some useful jQuery plugins that can make your job really easy. I suggest you give them a try. Here you have an example.

Since you are already using jQuery you could use jquery-ui.
They have an exmple of what you want to do here:
http://jqueryui.com/dialog/#modal
Once you get your modal dialog element setup, all you have to do is make and XHR for editpr.php, load the result into the elements innerhtml, then display the dialog.
// setup your modal dialog
var el = $( "#editpr-dialog" ).dialog({
// ... (other config options)
modal: true
});
// XHR editpr.php and show the dialog box
$.get('editpr.php', function(data){
el.html(data).dialog('open');
});

The custombox plugin has a lot of beautiful features and works amazingly with Jquery: http://dixso.github.io/custombox/

style a JavaScript onmouseover alert

This is my code to make the alert appear when i hover over the image;
var special_offers = document.getElementsByClassName("special_offer");
//for each special offer
for(i=0;i<special_offers.length;i++){
var special_offer = special_offers[i];
special_offer.setAttribute("offer_shown", "0");
special_offer.onmouseover = function(){
if( this.getAttribute("offer_shown") == "0" ){
this.setAttribute("offer_shown", "1");
alert('This room has the special offer attached to it, please book soon before you miss out!');
}
}
I wanted to find out how i change this from the bog standard JS alert to a box that i can style, i imagine i'd use some sort of a div.
Any help is much appreciated.

http://www.webdesignerdepot.com/2012/10/creating-a-modal-window-with-html5-and-css3/
This is a good resource for creating your own modal window. You can use your function to fire the modal window you created instead of just using alert() to fire up the standard alert.

Do you want to direct your message to a div?
Create the div
<div id="mySpecialOffer">
Some Text gets updated
</div>
In your js you could then target this id and update with what ever message you would like.
document.getElementById("mySpecialOffer").innerHTML = 'some Text';
You could even hide the div in css and then unhide with the JS.
Or you can create the HTML...
document.getElementById("mySpecialOffer").innerHTML = '<div> Special Offer Div Inserted </div>';
This is even easier with jQuery.
Is this what you had in mind?

What you should do is open a whole new window, like a small webpage with that message. That would be the easiest way to go!Here is a link: http://www.w3schools.com/jsref/met_win_open.asp
You will want to have the window.open() activated when people mouseover an image.you can specify the size and positioning of the window, in this case the center of the screen, and a small window.
Hope that helps!

Changing JavaScript alert buttons

How do you change the words on the buttons in a javascript alert? I am new so the simplest way possible would be greatly appreciated.

You can't.
Instead, you can create a fake dialog in the DOM, using jQuery UI Dialog.

not possible, the browser sets that
what you could do is make a fake alert from elements,

You can overriede window.alert and have your own implemenation of it.
window.alert = function(msg, options){
//Create the alert dialog box here using the default options and show the message.
}
You dont have to change your code in the application to use it.

Try something like this
function CustomAlert(msg){
var customAlert = $("#customAlert");
if(!customAlert.length){
customAlert = $(document.body).append('<div id="customAlert"><div class="message">Msg></div><div><input class="button" type="button" value="Ok" /></div></div>').hide();
}
customAlert.find("message").html(msg);
//Code to center the customAlert into view port along with faded background will go here
customAlert.find("input.button").unbind("click").click(function(){
//Hide the customAlert goes here
customAlert.hide();
});
}