Hi guys! I am new to javascript and need some help with an exercise!
The requirements:
Write a javascript function that loops from 1 to 50 and creates DOM elements:
a) DIV per each even number size 10 X 10 pixels black background
b) List per each multiples of 3 with the the number of elements according to the count
c) Input element per each multiples of 6 with the value of the count in the input
I suppose it starts like this..
var i;
for (var i= 0; i < 51; i++) {
console.log(i);
}
Then what? Anyone for help? Thanks everyone!!
Hi Guys! I am new to jquery. I had a doubt when using jquery. How to show the HTML file, When I swipe right on the page. I tried to change the color , but i dont know how to show the html file. Anyone help me!
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>swipeleft demo</title>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css">
<link rel="stylesheet" href="http://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.css">
<script src="http://code.jquery.com/jquery-1.11.3.min.js"></script>
<script src="http://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.js"></script>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap-theme.min.css">
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>
<style>
html, body { padding: 0; margin: 0; }
html, .ui-mobile, .ui-mobile body {
height: 105px;
}
.ui-mobile, .ui-mobile .ui-page {
min-height: 105px;
}
#nav {
font-size: 200%;
width:17.1875em;
margin:17px auto 0 auto;
}
#nav a {
color: #777;
border: 2px solid #777;
background-color: #ccc;
padding: 0.2em 0.6em;
text-decoration: none;
float: left;
margin-right: 0.3em;
}
#nav a:hover {
color: #999;
border-color: #999;
background: #eee;
}
#nav a.selected,
#nav a.selected:hover {
color: #0a0;
border-color: #0a0;
background: #afa;
}
div.box {
width: 30em;
height: 3em;
background-color: #108040;
}
div.box.swipeleft {
background-color: #7ACEF4;
}
div.box.swiperight {
background-color: #108040;
}
</style>
</head>
<body>
<h3>Swipe the green rectangle in the left direction to change its color:</h3>
<div class="box"></div>
<script>
$(function(){
// Bind the swipeleftHandler callback function to the swipe event on div.box
$( "div.box" ).on( "swipeleft", swipeleftHandler );
$( "div.box" ).on( "swiperight", swiperightHandler );
// Callback function references the event target and adds the 'swipeleft' class to it
function swipeleftHandler( event ){
$( event.target ).addClass( "swipeleft" );
}
function swiperightHandler( event ){
$( event.target ).addClass( "swiperight" );
}
});
</script>
</body>
</html>
markdown
and send the code @priyavenkat95