<!DOCTYPE html>
<html lang="en">
<head>
<title>Contact Information</title>
<meta charset="utf-8"/>
</head>
<h3>See our Directions!</h3>
<p>We open at <time>12:00</time> Monday to Thursday.</p>
<hr/>
<address>Email us at<br/>
cscreamery#gmail.com<br/>
or call us at<br/>
(719)-555-0987</address>
Directions
Home
Menu
<button type="button">C's Creamery</button>
</html>
I have been trying to figure out why my href links are not working no matter what i do. The pages i am trying to connect them to are named like in the code so i am highly confused.
You're missing a body tag and then closing tags .. browsers will behave badly ;)
<!DOCTYPE html>
<html lang="en">
<head>
<title>Contact Information</title>
<meta charset="utf-8"/>
</head>
<body>
<h3>See our Directions!</h3>
<p>We open at <time>12:00</time> Monday to Thursday.</p>
<hr/>
<address>Email us at<br/>
cscreamery#gmail.com<br/>
or call us at<br/>
(719)-555-0987</address>
Directions
Home
Menu
<button type="button">C's Creamery</button>
</body>
</html>
Please check like Home.html and other Html page that you are using for href are located at same folder where your main Html page is located.
I have created a sample.html page from above code and replaced Home.html page with my page
it is working.
<!DOCTYPE html>
<html lang="en">
<head>
<title>Contact Information</title>
<meta charset="utf-8"/>
</head>
<h3>See our Directions!</h3>
<p>We open at <time>12:00</time> Monday to Thursday.</p>
<hr/>
<address>Email us at<br/>
cscreamery#gmail.com<br/>
or call us at<br/>
(719)-555-0987</address>
Directions
Home
Menu
<button type="button">C's Creamery</button>
</html>
I have used chrome for it.I have put all the Html page like this webapp/app/view/sample.html and others also are available at view/
<html>
<body>
<a href="mailto:cscreamery#gmail.com"></i>Email us at
cscreamery#gmail.com</a>
or
<a href="tel:(719)-555-0987"></i>call us at
(719)-555-0987</a>
</body>
</html>
Related
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>SwinTech</title>
</head>
<body>
<form action="apply.html" method="post">
<div class="consultantinformation">
<h2> Job reference number: </h2>
<br>
<h4 id="jobreference2"> 6LZ9W </h4>
</div>
<button id="submitbutton">Submit</button>
</form>
<script>
document.getElementById("submitbutton").addEventListener("click", setItem);
localStorage.setItem("jobreference1", "1FN43");
</script>
</body>
</html>
I'm trying to transfer "jobreference1" from the 1st snippet to the 2nd using local storage. As you can see, I've stored it in one external JavaScript file and sent it to another. But when I try to call it in the HTML code in the 2nd snippet, to which the value was transferred to, it simply doesn't work. I've decided to include all of my HTML and JavaScript code for my second snippet because I believe that's where the issue lies. Thank you.
Note: no Inline JavaScript or jQuery.
This is a working example. The index.html sets the reference on page load. The form submit redirects to apply.html and it reads the correct value at page load.
index.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>SwinTech</title>
</head>
<body>
<form action="apply.html" method="post">
<div class="consultantinformation">
<h2> Job reference number: </h2>
<br>
<h4 id="jobreference2"> 6LZ9W </h4>
</div>
<button>Submit</button>
</form>
<script>
localStorage.setItem("jobreference1", "1FN43");
</script>
</body>
</html>
apply.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<p>Job Reference Number: <span id="job1"></span></p>
<script>
document.getElementById("job1").innerHTML = localStorage.getItem("jobreference1");
</script>
</body>
</html>
I am currently working on the beginning stages of js and trying to create buttons and alerts with it. when i write my code, the alerts work but my buttons are not appearing. when i inspect my webpage, the buttons dont even appear in the code. any suggestions on what i can do to fix this?
alertmessage.html
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>alert message</title>
</head>
<body>
<p>Javascript.</p>
<script type="text/javascript" src="js/code.js">
</script>
</body>
</html>
code.js
window.alert("Welcome to Javascript");
buttons.html
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>alert message</title>
</head>
<body>
<p>Javascript.</p>
<button onclick="alert('How can I help you?')">Click me.</button>
<button id="button 2">Click me.</button>
<script>
document.getElementbyId("button 2").onclick=function(){
alert("You have just clicked me!");
}
</script>
</body>
</html>
well at first try not to use spaces when you create your buttons ids e.g (id="button 2")
instead use id="button2"
I modified your code adding the event listener on document ready find the below code hope that is what you are looking for, it should get your started.
Note: for posting here when you write your message paste your code under your message text and select the code then Press ctrl+K that should identify your code area then post it and all should work fine...
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>alert message</title>
</head>
<body>
<p>Javascript.</p>
<button onclick="alert('How can I help you?')">Click me.</button>
<button id="button2">Click me.</button>
<script>
$(document).ready(()=>{
document.getElementById("button2").addEventListener("click", function(){
alert("You have just clicked me!");
});
})
</script>
</body>
</html>
I have a new project where I should implement a new application in an existing system. Users will be able to access my app through an existing login page. Once they log in I will have all information available in my session variables. Link for my app is available for the users based on their credentials. Now I want to organize my home page. My question is should I use iframe to be my home page? Should I place everything else inside of the iframe? I don't have experience working with iframes and I'm not sure if this is the best option. Here is example of what I have:
<iframe src="Home.cfm" name="homeFrame" id="homeframe" frameborder="0" scrolling="no"></iframe>
Here is my Home.cfm page:
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="X-UA-Compatible" content="IE=10; IE=11" />
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Home Page</title>
<script src="JQuery/jquery-3.2.1.min.js"></script>
</head>
<body>
<div class="mainpage">
</div>
</body>
</html>
Also i have included JQuery on my home page. I might have two more pages in this app. Is that the best place to include the library? Or that should be included on each page in the app?
If you add it in home page that is enough.Try like below:
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="X-UA-Compatible" content="IE=10; IE=11" />
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Home Page</title>
<script src="JQuery/jquery-3.2.1.min.js"></script>
<script src="default.js"></script>
</head>
<body>
<div class="mainpage">
//whatever you have already in this page.Using iframe you can display a separate document, including scrollbars and borders.
<iframe src="Home.cfm" name="homeFrame" id="homeframe" frameborder="0" scrolling="no"></iframe>
</div>
</body>
</html>
default.js:
$(function(){
alert('success');
//your stuff
});
I try to use prismjs http://prismjs.com/download.html for code highlighting, but it is not working see this fiddle http://jsfiddle.net/939u16ac/ I am getting the rendered HTML instead of the markup PFA markup and Screenshot
HTML File:
<!doctype html>
<html lang="en">
<head>
<title> Demo</title>
<meta charset="utf-8"/>
<link rel="stylesheet" href="lib/prism.css">
<script src="lib/prism.js"></script>
</head>
<body onload="">
<pre class="line-numbers language-markup">
<code class="">
<ol type="1">
<li>
href atribute is must and id, class, title attribute are optional
</li>
<li>
In angular application or you are not having any navigation link, use <b>javascript:void(0)</b> in href attribute value
</li>
</ol>
<a id="optionalID" class="optionalClass" title="optionalTitle" href="Product.html" >Product Page</a>
</code>
</pre>
</body>
</html>
Could any one spot me where i went wrong in implementing it?
Thanks in advance for any help.
I'm customising my homepage with an interactive animation, but having trouble making it feel more seemelss in the page. Please see http://geotheory.co.uk/. I want to stop the canvas object from being selected when the user clicks on the page. The animation is a Processing script that is then translated to javascript. The index.html reads:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<title>geotheory.co.uk</title>
</head>
<body id="home" bgcolor="#202020">
<script src="processing-1.4.1.min.js"></script>
<div id="canvasContainer">
<canvas padding: 0 data-processing-sources="rectangles.pde"></canvas>
</div>
</body>
Grateful for assistance.
It is the :focus pseduo class that is causing it. This should fix it:
canvas:focus{
outline:none;
}