Hello friends i am making a coming soon
HTML template and using countdown timer ,
i want to make time
refresh automatically after 1 sec
i want to make the javascript execute atumatically
<!DOCTYPE HTML>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width">
<meta name="keywords" content="nineforo,9foro">
<title>9foro | Coming soon</title>
<link rel="stylesheet" href="" type="text/css">
<link href='http://fonts.googleapis.com/css?family=Philosopher:700' rel='stylesheet' type='text/css'>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
<script type="text/javascript" src="jquery.countdown.pack.js"></script>
<!--[if lt IE 9]>
<script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->
<script type="text/javascript">
$(function () {
$('#countdown').countdown({until: new Date(2014, 5 - 1, 1)});
});
</script>
</head>
<body>
<div id="wrapper">
<header>
<h2>9fORO</h2>
<section id="timer">
<p>Estimated time remaining before official launch:</p>
<div id="countdown"></div>
</section>
</div>
</body>
</html>
Can not find your script jquery.countdown.pack.js. But you can try https://github.com/hilios/jQuery.countdown
<!DOCTYPE HTML>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width">
<meta name="keywords" content="nineforo,9foro">
<title>9foro | Coming soon</title>
<link rel="stylesheet" href="" type="text/css">
<link href='http://fonts.googleapis.com/css?family=Philosopher:700' rel='stylesheet' type='text/css'>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
<script type="text/javascript" src="jquery.countdown.pack.js"></script>
<script type="text/javascript" src="https://raw.githubusercontent.com/hilios/jQuery.countdown/master/dist/jquery.countdown.min.js"></script>
<!--[if lt IE 9]>
<script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->
<script type="text/javascript">
$(function () {
$('#countdown').countdown("2014/14/04",function(event){
$(this).html(event.strftime('%D days %H:%M:%S'));
});
});
</script>
</head>
<body>
<div id="wrapper">
<header>
<h2>9fORO</h2>
<section id="timer">
<p>Estimated time remaining before official launch:</p>
<div id="countdown"></div>
</section>
</div>
</body>
</html>
Related
Hi I am trying to add a start button via jquery to appear when the page loads. However, the button is not loading.
Here is my code:
$(window).on('load', function() {
const startPage = $("<button id='start'>Go</button>");
$('main').append(startPage);
});
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Quiz</title>
<link href="https://cdnjs.cloudflare.com/ajax/libs/normalize/8.0.1/normalize.min.css" rel="stylesheet" type="text/css" />
<link href="app.css" rel="stylesheet" type="text/css" />
</head>
<body>
<header>
<h1>Objective London Quiz</h1>
</header>
<main class="questions"></main>
<script src="https://code.jquery.com/jquery-3.4.1.slim.js" crossorigin="anonymous"></script>
<script src="app.js"></script>
</body>
</html>
I am trying to do a project with javascript using events on keys to display alphabets on the screen, I'm stuck with this error. please help
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title></title>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.4.0/css/font-awesome.min.css">
<!--[if lt IE 9]>
<script src="https://oss.maxcdn.com/libs/html5shiv/3.7.2/html5shiv.js"></script>
<script src="https://oss.maxcdn.com/libs/respond.js/1.4.2/respond.min.js"></script>
<![endif]-->
</head>
<body>
<script src="script.js" charset="utf-8"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>
</body>
</html>
This is the script file that I'm using
script.js
(document).keydown(function(event) {
if (event.which === 13) {
console.log("you pressed");
}
});
You're running your script before jQuery, so $ doesn't exist yet.
Place
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
Before
<script src="script.js" charset="utf-8"></script>
Kotlin versions 1.0.x-1.1.0 support out of the box unit testing with QUnit but when I load tests it throws this exception:
ReferenceError: ok is not defined
at QUnitAsserter.assertTrue_4mavae$ (file:///D:/neoranga/Mis%20documentos/GitHub/FibonacciCounter/app/build/classes/test/lib/kotlin-test-js.js:50:5)
at assertTrue (file:///D:/neoranga/Mis%20documentos/GitHub/FibonacciCounter/app/build/classes/test/lib/kotlin-test-js.js:93:27)
at QUnitAsserter.assertTrue_o10pc4$ (file:///D:/neoranga/Mis%20documentos/GitHub/FibonacciCounter/app/build/classes/test/lib/kotlin-test-js.js:47:5)
at QUnitAsserter.Asserter.assertEquals_lzc6tz$ (file:///D:/neoranga/Mis%20documentos/GitHub/FibonacciCounter/app/build/classes/test/lib/kotlin-test-js.js:182:10)
at assertEquals (file:///D:/neoranga/Mis%20documentos/GitHub/FibonacciCounter/app/build/classes/test/lib/kotlin-test-js.js:108:20)
at AppTest.myFirstTest (file:///D:/neoranga/Mis%20documentos/GitHub/FibonacciCounter/app/build/classes/test/app_test.js:17:5)
at Object.<anonymous> (file:///D:/neoranga/Mis%20documentos/GitHub/FibonacciCounter/app/build/classes/test/app_test.js:29:21)
This is my test class:
import org.junit.Test
import kotlin.test.assertEquals
class AppTest {
#Test fun myFirstTest() {
assertEquals(1, 1, "Test in test folder works")
}
}
This is the html code that loads the test:
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Fibonacci Counter</title>
<link rel="stylesheet" href="css/app.css">
<meta name="viewport" content="width=device-width">
<link rel="stylesheet" href="https://code.jquery.com/qunit/qunit-2.1.1.css">
</head>
<body>
<div id="qunit"></div>
<div id="qunit-fixture"></div>
<footer id="info">
<p>Placeholder</p>
</footer>
<span id="text"></span>
<script src="external_libs/jquery-3.1.1.min.js"></script>
<script src="https://code.jquery.com/qunit/qunit-2.1.1.js"></script>
<script src="lib/kotlin.js"></script>
<script src="lib/kotlin-test-js.js"></script>
<script src="app_main.js"></script>
<script src="app_test.js"></script>
</body>
</html>
The problem is in the version of QUnit 2.1.1, by using version 1.23.1 the problem is solved.
This is the html code that loads the test with the fix:
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Fibonacci Counter</title>
<link rel="stylesheet" href="css/app.css">
<meta name="viewport" content="width=device-width">
<link rel="stylesheet" href="https://code.jquery.com/qunit/qunit-1.23.1.css">
</head>
<body>
<div id="qunit"></div>
<div id="qunit-fixture"></div>
<footer id="info">
<p>Placeholder</p>
</footer>
<span id="text"></span>
<script src="external_libs/jquery-3.1.1.min.js"></script>
<script src="https://code.jquery.com/qunit/qunit-1.23.1.js"></script>
<script src="lib/kotlin.js"></script>
<script src="lib/kotlin-test-js.js"></script>
<script src="app_main.js"></script>
<script src="app_test.js"></script>
</body>
</html>
I was trying to develop webix header and sidebar by using html which I have seen below. Currently it is developed in javascript.
http://docs.webix.com/samples/28_sidemenu/01_sidebar.html
I am changing from javascript to html
Header,icons,sidebar eveything appearing in the html, however the contents on the sidebar does not appear. I am not sure whats the mistake I have done. Below is my code.
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
<link rel="stylesheet" href="./codebase/webix.css" type="text/css"
media="screen" charset="utf-8">
<link rel="stylesheet" href="./codebase/sidebar.css" type="text/css"
media="screen" charset="utf-8">
<script src="./codebase/webix.js" type="text/javascript" charset="utf-8"></script>
<script src="./codebase/sidebar.js" type="text/javascript"
charset="utf-8"></script>
<script src="./codebase/data.js" type="text/javascript" charset="utf-8"></script>
</head>
<body>
<script type="text/javascript" charset="utf-8">
webix.ready(function() {
webix.markup.init();
});
function toggle(){
$$("$sidebar1").toggle()
}
</script>
<div class="container" id="mainDiv"></div>
<div data-view="rows">
<div data-view="toolbar" data-padding="5">
<div data-view="button" data-type="icon" data-icon="bars"
data-width="37" data-align="left" data-css="app_button"
data-click="toggle()"></div>
<div data-view="label" data-label="My App"></div>
<div data-view="button" data-type="icon" data-icon="envelope-o"
data-width="45" data-css="app_button" data-badge="4"></div>
<div data-view="button" data-type="icon" data-icon="bell-o"
data-width="45" data-css="app_button" data-badge="10"></div>
</div>
</div>
<div data-view="cols">
<div data-view="sidebar" data-id="sidebar" data-data="menu_data"></div>
</div>
</body>
</html>
I am getting this error when try to load "jquery.wysiwyg.js" file.
html file
<textarea style="width:765px; height:300px; margin:10px 0 0 0" id="desp" name="description" cols="20" rows="5" ></textarea> javascript <script type="text/javascript"> (function($) { $('#desp').wysiwyg(); })(jQuery); </script>
basic sample html code
<!DOCTYPE html>
<html lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
<title>Example: Basic - jWYSIWYG</title>
<link rel="stylesheet" type="text/css" href="../lib/blueprint/screen.css" media="screen, projection" />
<link rel="stylesheet" type="text/css" href="../lib/blueprint/print.css" media="print" />
<!--[if lt IE 8]><link rel="stylesheet" href="../lib/blueprint/ie.css" type="text/css" media="screen, projection" /><![endif]-->
<link rel="stylesheet" href="../../jquery.wysiwyg.css" type="text/css"/>
<script type="text/javascript" src="../lib/jquery.js"></script>
<script type="text/javascript" src="../../jquery.wysiwyg.js"></script>
<script type="text/javascript" src="../../controls/wysiwyg.image.js"></script>
<script type="text/javascript" src="../../controls/wysiwyg.link.js"></script>
<script type="text/javascript" src="../../controls/wysiwyg.table.js"></script>
<script type="text/javascript">
(function($) {
$(document).ready(function() {
$('#wysiwyg').wysiwyg();
});
})(jQuery);
</script>
</head>
<body><div class="container">
<h1>jWYSIWYG</h1>
<h2>Example: Basic</h2>
<textarea id="wysiwyg" rows="5" cols="80"></textarea>
<hr/>
Index
</div></body>
</html>