The password prompt window refuses to align with the center of the screen. This

I've been struggling to position the Javascript popup notification using the width, height, top, and left parameters in the window.open function. No matter what I attempt, it stubbornly remains in the top-left corner. Can someone offer some guidance on how to fix this issue?

function password() {
var testV = 1;
var pass1 = prompt('Please Enter Your Password','Enter your password here');
while (testV < 3) {
if (!pass1) 
history.go(0);
if (pass1.toLowerCase() == "test") {
/*alert('You Are Successful, Click To Continue!'); */
var targetWin = window.open('');
break;
} 
testV+=1;
var pass1 = 
prompt('Access Denied - Your Password Is Incorrect, Please Try Again.','Enter your     
password here');
}
if (pass1.toLowerCase()!="password" & testV ==3) 
history.go(0);
return "";
} 

Answer №1

To center the target window, you can follow this approach:

Let's say your target window size is 485 by 700.

function launchWindow(url)
{
    var xPos = screen.width/2 - 700/2;
    var yPos = screen.height/2 - 450/2;
    window.open(url.href, 'sharegplus','height=485,width=700,left='+xPos+',top='+yPos);
}

var newWin = launchWindow(<website>);

Answer №2

It seems that manipulating the alert and prompt functions directly in the browser may not be possible due to their inherent setup and functionality. However, you can create a custom popup using JavaScript, HTML, and CSS to have more control over its design and behavior. One option is to use a jQuery plugin for creating popups like this one:

Answer №3

The "top" attribute is specifically designed for Internet Explorer, meaning it won't affect other browsers targeted in your code. In order to achieve the same vertical alignment in Chrome, Firefox, Safari, and Opera, you'll need to explore alternative methods using Java, HTML, and CSS in combination.

Consider utilizing jquery as a viable solution, keeping in mind that functionality may be compromised if users have javascript disabled. To ensure a responsive design, it may be necessary to implement multiple approaches to accomplish the same task. Experiment with jquery along with the code shared by Jose to assess cross-browser compatibility effectively.

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

Extract JSON data from a third-party website using JavaScript

I'm facing a challenge parsing JSON from an external website using JavaScript or jQuery for a Chrome extension. Specifically, I need to extract the number from an external URL with the JSON {"_visitor_alertsUnread":"0"} and assign that number to a var ...

Is there a method available to retrieve the data values stored within these objects?

Looking at the image below, I have data that includes a Data array in JSON format. The Data array contains key values such as condition_type and other related values. In order to extract individual values, I am using the following code: const submitcode ...

Is it possible to group an array of objects by a specific element?

Take a look at this example: JsFiddle Query: I'm dealing with the following JSON Array y= [ {"LngTrend":15,"DblValue":10,"DtmStamp":1358226000000}, {"LngTrend":16,"DblValue":92,"DtmStamp":1358226000000}, {"LngTrend":17,"DblValue":45,"DtmSta ...

Floating Action Button combined with a Material UI ListItem

I am working on creating a basic list with a listItem that includes a button. The code I currently have is as follows: import React from "react"; import darkBaseTheme from 'material-ui/styles/baseThemes/darkBaseTheme'; import MuiThemeProvider ...

jqGrid doesn't refresh after making an AJAX request

I'm encountering an issue when trying to refresh a jqgrid. Despite attempting various solutions, I have yet to find one that works. My goal is to refresh the grid after receiving JSON data from the server side. Below is the code snippet showcasing how ...

iterative outcomes with ajax and jquery scripting in javascript

Hey there! I'm trying to create a JavaScript script using AJAX that will extract the id and value of a button when hovered over. The extracted value will then be sent to a PHP script on the same page, where it will be used as a variable for searching ...

Is the Sourcecode for the Raspberry Pi Cam with WebRTC and UV4l driver Closed?

I'm utilizing the UV4L driver (RasPiCam) from this link along with the WebRTC extension to achieve a continuous live view, streaming out via this HTTP server (RaspberryPi). I am interested in examining the source code being executed on the server. Is ...

Adding hyperlinks to images on a Project Page in Squarespace with the help of JQuery

I'm currently creating a website on Squarespace and facing a challenge with the project pages. While Squarespace allows me to add images with titles and descriptions, I do not have direct access to edit the page. Unfortunately, the platform does not h ...

broadcast updated $rootScope

How do I update the $rootScope.$broadcast with a new value? Let's take a look at this code snippet: var test = "fisk"; if(angular.element(this).hasClass('monster')) { var monster_info = angular.element(this).find("img").attr("title"); ...

Tips for converting a URL to the correct route in emberjs when the location type is set to history

After creating a basic Ember.js application and setting the router location type to 'history', I encountered an issue with the generated URLs. Instead of the expected URL format like http://localhost/#/post/1, the Ember.js application was changi ...

Discovering the frequency of a specific key in a JSON object or array using JavaScript

Suppose I have a JSON object with the given data, how can I determine the frequency of the key: "StateID"? [{"StateID":"42","State_name":"Badakhshan","CountryID":"1"}, {"StateID":"43","State_name":"Badgis","CountryID":"1"}, {"StateID":"44","State_name": ...

Guide on how to show the index value of an array on the console in Angular 2

Is there a way to show the array index value in the console window upon clicking the button inside the carousel component? The console seems to be displaying the index value twice and then redirecting back to the first array index value. Can we make it so ...

What is the best way to use Jquery ScrollTo() to navigate to an element on a page using a class selector

Building on the information from this source, I have a question: How can I resolve the same issue using a class selector like $('.class')? I am encountering an error message that says Uncaught TypeError: undefined is not a function This occurs ...

Guide to dynamically incorporating items from an array into the filter operation

How can I dynamically insert items from an array into the filter on the wizard.html page, so that when the templateUrl in the route is called, it can be rendered on the wizard.html page? Controller angular.module('tareasApp') .controller(&apo ...

Combine the information from another cell and add it to the current cell with additional data

Can you help me figure out a way to input numbers and have Google Sheets calculate the change percentage in the same cell? Here's an example: Oct 20 Nov 20 Dec 20 90 100 (+10%) 95 (-5%) I'm hoping to do this without using additional cell ...

Verify if the nested JSON object includes a specific key

Currently, I am grappling with a dilemma on how to determine if within a deeply nested JSON object, featuring numerous unknown arrays and properties, lies a specific property that goes by the name "isInvalid". My objective is to identify this property and, ...

Tips for resolving the error message "cannot find module './node'" when compiling with pkg:

After successfully running my Node.js script with 'node main.js', I encountered an error when trying to compile it into an executable using pkg: pkg/prelude/bootstrap.js:1876 throw error; ^ Error: Cannot find module './node' Require s ...

Is jQuery AJAX returning improperly formatted JSON when using the jsonp type?

$('#rn_s').keyup(function() { var rn = $('#rn_s').val(); if(rn.length == 9) { $.ajax({ url: 'http://routingnumbers.info/api/data.json?rn=' + rn, type: 'GET', dataT ...

Is it possible to use JavaScript to upload and manipulate multiple HTML files, replacing text within them to create new output HTML pages?

Is it possible to modify the following code to accept multiple files, process them, and then return the output? <html> <head> </head> <body> <div> <label for="text">Choose file</label> <inp ...

Toggle the visibility of the data depending on the dropdown option chosen

Currently, I am developing an AngularJS application and facing a requirement to toggle the visibility of data based on the selected value in a dropdown list. Specifically, if the user chooses "Show" from the dropdown, the content within a tab should be dis ...