How to change image on mouse over
<script type=”text/javascript” src=”http://code.jquery.com/jquery-1.8.2.js”></script>
<script type=”text/javascript”>
$(function() {
$(“#imgdetails”).hover(function() {
$(this).attr(“src”, “http://d3l2031tfshpe7.cloudfront.net/Images/Product/DRS00420A/2.jpg”);
}, function() {
$(this).attr(“src”, “http://d3l2031tfshpe7.cloudfront.net/Images/Product/DRS00420A/1.jpg”);
});
})
$(function() {
$(“#img”).hover(function() {
$(this).attr(“src”, “http://localhost/marketingcertifiednew/wp-content/uploads/2014/11/marketing-certified-home59ro.jpg”);
}, function() {
$(this).attr(“src”, “http://localhost/marketingcertifiednew/wp-content/uploads/2014/09/marketing-certified-home59.jpg”);
});
})
</script>
2 How to change image on mouse over
<span class=”test” style=”float: left; margin-top: -10px;”;>
<a href=”#s-pricing” onmouseover=”document.getElementById(‘myimage1′).src=’wp-content/uploads/2014/11/marketing-certified-home59ro.jpg’;”
onmouseout=”document.getElementById(‘myimage1′).src=’wp-content/uploads/2014/09/marketing-certified-home59.jpg’;”>
<img width=”171″ height=”45″ src=”wp-content/uploads/2014/09/marketing-certified-home59.jpg” id=”myimage1″ /></a></span>
How to use random image in JavaScript
how to change image on reload/refresh website
<div id=”box”>
<a href=”#”> <img id=”image” /></a>
</div>
<script>
var images = [
“wp-content/themes/marketingcertified/image/owl-mascot.jpg”,
“wp-content/themes/marketingcertified/image/owl-mascot2.jpg”,
“wp-content/themes/marketingcertified/image/owl-mascot3.jpg”,
“wp-content/themes/marketingcertified/image/owl-mascot4.jpg”,
“wp-content/themes/marketingcertified/image/owl-mascot5.jpg”,
“wp-content/themes/marketingcertified/image/owl-mascot6.jpg”,
“wp-content/themes/marketingcertified/image/owl-mascot7.jpg”,
“wp-content/themes/marketingcertified/image/owl-mascot8.jpg”,
“wp-content/themes/marketingcertified/image/owl-mascot9.jpg”,
“wp-content/themes/marketingcertified/image/owl-mascot10.jpg”,
“wp-content/themes/marketingcertified/image/owl-mascot11.jpg”];
function randImg() {
var size = images.length
var x = Math.floor(size * Math.random())
document.getElementById(‘image’).src = images[x];
}
randImg();
</script>
how to show a form in popup by jquery
<html>
<head>
<title>LIGHTBOX EXAMPLE</title>
<style>
.black_overlay{
display: none;
position: absolute;
top: 0%;
left: 0%;
width: 100%;
height: 100%;
background-color: black;
z-index:1001;
-moz-opacity: 0.8;
opacity:.80;
filter: alpha(opacity=80);
}
.white_content {
display: none;
position: absolute;
top: 25%;
left: 25%;
width: 50%;
height: 50%;
padding: 16px;
border: 16px solid orange;
background-color: white;
z-index:1002;
overflow: auto;
}
</style>
</head>
<body>
<p>This is the main content. To display a lightbox click <a href = “javascript:void(0)” onclick = “document.getElementById(‘light’).style.display=’block’;document.getElementById(‘fade’).style.display=’block'”>here</a></p>
<div id=”light” class=”white_content”>This is the lightbox content. <a href = “javascript:void(0)” onclick = “document.getElementById(‘light’).style.display=’none’;document.getElementById(‘fade’).style.display=’none'”>Close</a></div>
<div id=”fade” class=”black_overlay”></div>
</body>
Web Smart Development 
