HTML or JAVA Script for my random page viewer [closed] - javascript

Closed. This question needs to be more focused. It is not currently accepting answers.
Want to improve this question? Update the question so it focuses on one problem only by editing this post.
Closed 6 years ago.
Improve this question
Hi Everyone
Please help me on getting html code or javascript.
I'm really new on to this thing. I just wanted to have a page generator to generate a random page on our company website.
where you will be click a link then it will redirect you on a random page on your website.
our company url pages will be like this.
http://www.company.com/pages/xxxx.pdf
Where if i click on get random page, it will go on 1123.pdf .. pages will be random from 1xxxx to 3xxxx.
i would like to make it simple and should be on one page.
Thanks! :D

Here you go. I've added comments to the code that explain how everything works.
<!DOCTYPE HTML>
<html lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Open random url</title>
<script type="text/javascript">
/* Function to generate random number */
function randomIntFromInterval(min,max)
{
return Math.floor(Math.random()*(max-min+1)+min);
}
/* Wait untill the document is fully loaded */
document.addEventListener('DOMContentLoaded', function(){
/* Catch click event on hyperlink */
document.getElementById("randomLink").addEventListener("click", function(event){
/* Prevent the browser from following the hyperlink */
event.preventDefault();
/* Generate random number between 1000 and 4000 */
var randomNumber = randomIntFromInterval(1000, 4000);
/* Redirect to a random PDF file on the website */
window.location.href = "http://www.company.com/pages/"+ randomNumber +".pdf";
});
});
</script>
</head>
<body>
Open random PDF
</body>
</html>

Related

how to get webpage refresh automatically every 10sec [closed]

Closed. This question needs details or clarity. It is not currently accepting answers.
Want to improve this question? Add details and clarify the problem by editing this post.
Closed 3 months ago.
Improve this question
I do not know where to put the function
setTimeout('history.go(0);', 10000)
how do I code on a page?
One place you could put it is here:
<html>
<head>
<script>
setTimeout('history.go(0);', 10000)
</script>
<head>
<body>
..
</body>
</html>
another, better way is to write the script as follows
<html>
<head>
<script>
//console.info('initial load');
addEventListener('DOMContentLoaded', function () {
setTimeout(function () {
//console.info('reloading');
window.location.reload();
}, 10000);
})
</script>
<head>
<body>
my body
</body>
</html>
because this will wait for the whole document to be loaded before executing.
I would recommend reading up on AJAX and only fetching the parts you need as an asynchronous event, instead of loading the whole page again and again...
You don't even need a script...
Just add
<meta http-equiv="refresh" content="10">
in the headers.
Why do you try to do this via JS???
You need a timeout function to execute after 10 seconds (10000ms)
You can reload the page with window.location.reload()
setTimeout(function () {
window.location.reload();
}, 10000);

How to change opacity of a div on button click using JS? [closed]

Closed. This question needs debugging details. It is not currently accepting answers.
Edit the question to include desired behavior, a specific problem or error, and the shortest code necessary to reproduce the problem. This will help others answer the question.
Closed 10 months ago.
Improve this question
I am trying to add a script to my HTML file that changes the opacity of a div when a button is clicked.
This is the HTML file
This is the CSS file
This is my function
Essentially what I'm trying to achieve is the div that is currently set to 0 opacity, will be change to 1 opacity on the click of the button. Currently this is not working, and I am relatively new to incorporating JS in and HTML file. Any tips would be greatly appreciated.
Here's a simple example using JavaScript embedded in HTML. Make sure you're using an event listener that listens for the click of your button.
<!DOCTYPE html>
<html>
<head>
<title>About Me</title>
</head>
<body>
<h1 style="opacity: 0;">About Me</h1>
<button>
Show
</button>
<script>
var button = document.querySelector('button');
button.addEventListener('click', function() {
var h1 = document.querySelector('h1');
h1.style.opacity = 1;
});
</script>
</body>
</html>

javascript: How would you make text spin using javascript? [closed]

Closed. This question needs details or clarity. It is not currently accepting answers.
Want to improve this question? Add details and clarify the problem by editing this post.
Closed 6 years ago.
Improve this question
I have this code:
<img src="http://www.w3schools.com/html/html5.gif" id="imgid">
<h1 id='header'>Example</h1>
<!--This is an example html doc not the real thing!-->
<button onclick="spin(document.getElementById('header'));spin(document.getElementById('imgid'));">Spin!</button>
<script>
function spin(object) {
setInterval(function() {
object.style.transform += "rotate(10deg)";
}, 1);
}
</script>
How do I make the text spin correctly? If you could explain how it works then that would be great. If you need any references of my sources then:
SetInterval
style.transform
By "correctly" I mean spinning centered. (Not all over the page).
Thanks!
Try this. The main problem was that the width extended all the way across the page which messed up the rotation, so adding in display:inline-block made the width match up with the div's contents.
<style>
#imgid{display:inline-block;}
#myDIV{display:inline-block;}
</style>
<html>
<head>
<title>Example</title>
</head>
<body>
<div><img src="http://www.w3schools.com/html/html5.gif" id="imgid"></div>
<div><h1 id='myDIV'>Example</h1></div>
<div><button onclick="spin(document.getElementById('imgid'));spin(document.getElementById('myDIV'));">xdfdsf</button></div>
</body>
</html>
<script>
function spin(object)
{
setInterval(function()
{
object.style.transform += "rotate(10deg)";
}, 1);
}
</script>

To Do list in HTML/Javascript/jQuery [closed]

Closed. This question needs to be more focused. It is not currently accepting answers.
Want to improve this question? Update the question so it focuses on one problem only by editing this post.
Closed 7 years ago.
Improve this question
I'm trying to make a to do list in Javascript / HTML5. Here's my HTML:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>To Do </title>
<link rel="stylesheet" href="todolist.css">
<script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script>
<script src="http://code.jquery.com/jquery-1.8.3.min.js"></script>
<script src="To Do.js"></script>
</head>
<body>
<div id="list">
</div>
<form id="to_do_list">
<h2>What do you want to do? </h2>
<input type="text" id="task" name="task"><br>
<br/>
<button type="button" id="addToList"> Add to List </button> <br/>
</form>
</body>
</html>
I'm trying to figure out how to work Javascript that will form a list with the user's entries.
Sorry if this is easy, I am new to this.
JavaScript
window.onload = function () {
$("addToList").onclick = addTask;
}
var addTask = function() {
alert("You clicked it!");
}
You need to decide whether to use JQuery or Javascript for your script section.
It looks you have used Javascript, then switched to JQuery to reference an object then went back to Javascript. Try to stick to just one.
<script>
// this could be $(window).ready(function() { ...
window.onload = function () {
$("#addToList").click(addTask); // you need to point at the id #addToList
}
var addTask = function() {
var task = $("#task").val(); // references the value inside #task
$("#list").append("<p>"+task+"</p>") // makes a new <p> element
$("#task").val(""); // empties out #task
}
</script>
I'm not really sure what you're looking for, but this does what I think you want.
Also, I don't think you should use spaces in filenames ("To do.js")

Passing values from one page to another in JavaScript [closed]

Closed. This question needs details or clarity. It is not currently accepting answers.
Want to improve this question? Add details and clarify the problem by editing this post.
Closed 9 years ago.
Improve this question
In below code, the value is not passed from one page to another.
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<script type="text/javascript">
function generateRow() {
var myvar = "testuser";
'<%Session["temp"] = "' + myvar +'"; %>';
window.location = "WebForm2.aspx";
}
</script>
<head>
<title></title>
</head>
<body>
<div runat="server">
<input id="Button1" type="button" onclick="generateRow()" value="button" />
</div>
</body>
</html>
What is the problem in above code?
You cannot set a session with Javascript. Your output JS file will be exactly what you wrote down.
You can do it like this:
window.location = "WebForm2.aspx?temp=" + myvar;
And in Webform2 you can do:
Request.querystring["temp"];
Global variables in one page are not kept by the next.
If you want this client-side, you have three options (at least):
Pass the variable to the next page on the query string, e.g.:
window.location = "WebForm2.aspx?myvar=" + encodeURIComponent(myvar);
Use a cookie (millions of examples online, I won't repeat them, bit of a pain to read the cookie).
Use client-side session storage or local storage, both of which are covered here. Here's the client-side session storage example:
// Setting
sessionStorage.myvar = myvar;
// Getting (on the next page)
var myvar = sessionStorage.myvar;
(sessionStorage is a global variable provided by the browser.)
This works on just about any browser you need to care about (IE8+, and modern versions of basically everything else).
Server-side, both option 1 and 2 would work, but 1 would make the most sense.

Categories