Ads 468x60px

Labels

Showing posts with label Java Script. Show all posts
Showing posts with label Java Script. Show all posts

Friday, January 22, 2016

Get current URL in Jquery and JavaScript.


Get current URL in Jquery and JavaScript?
My url is http://www.rohitazad.com:4545/index.php#tab5?foo=890

In Jquery
Property     Result
______________________________________________

host     www.rohitazad.com:4545

hostname     www.rohitazad.com

port     4545

protocol     http:

pathname     index.php

href     http://www.rohitazad.com:4545/index.php#tab5

hash     #tab5

search     ?foo=890

var locationWindow = $(location).attr('property');
In JavaScript
window.location.host     www.rohitazad.com:4545

window.location.hostname     www.rohitazad.com

window.location.port     4545

window.location.protocol     http:

window.location.pathname     index.php

window.location.href     http://www.rohitazad.com:4545/index.php#tab5

window.location.hash     #tab5

window.location.search     ?foo=890

Friday, January 8, 2016

How to create a element in jquery ?


Hi it's very simple download to jquery plugin and write some code Define a variable assign to value as like this
Jquery Code here
$(document).ready(function(){
// Create a HTML Tag Code here start
var newDiv = document.createElement('div');
$(newDiv).addClass('wraper');
$(newDiv).attr('data-role','wraperDivAttribute');
$(newDiv).html('This is wraper section');

$(newDiv).appendTo($("body")) ;// wraper div append to body
// Create a HTML Tag Code here end
});




Monday, July 6, 2015

How to create Accordion in simple jQuery code .

How to create Accordion in simple  jQuery code .

It's very simple now create simple html code and apply this simple jquery code as like this

HTML Code here
<div id="accordion">
    <h2><a href="#">Accordian Tab 1</a></h2>
    <div>
      <p>Accordian Tab 1 Data</p>
    </div>
    <h2><a href="#">Accordian Tab 2</a></h2>
    <div>
      <p>Accordian Tab 2 Data</p><br />
    </div>
    <h2><a href="#">Accordian Tab 3</a></h2>
    <div>
      <p>Accordian Tab 3 Data</p>
    </div>
    <h2><a href="#">Accordian Tab 4</a></h2>
    <div>
      <p>Accordian Tab 4 Data</p>
    </div>
  </div>
Css Code here
body {
  font-family: arial;
  font-size: 12px;
}
#accordion h2 {
  padding: 10px;
  margin: 0;
  border: 1px solid #4679bd;
  background-color: #4072b4;
  font-size: 14px;
  border-top: 3px solid #ccc;
}
#accordion h2 a {
  text-decoration: none;
  color: #ffffff;
}
#accordion div {
  padding: 0 10px;
  margin: 0;
  border: 1px solid #4679bd;
  color: #000;
}
Jquery Code here
$(document).ready(function() {
  $("#accordion div").hide();
  $("#accordion h2").click(function() {
    $(this).next("#accordion div").slideToggle("slow").siblings("#accordion div").slideUp("slow");
  });
});
Demo Jsfiddle

Friday, March 21, 2014

Section have a fixed position when it hits the top of the screen

How to do this it's very simple here example see below .
Jquery Code
var oritop = -100;
$(window).scroll(function() {
var scrollt = $(this).scrollTop();
var elm = $(".scrollTopWindow");
if(oritop < 0) {
oritop= elm.offset().top;
}
if(scrollt >= oritop) {
elm.css({"position": "fixed", "top": 0, "left": 0});
}
else {
elm.css("position", "static");
}
});
Css here code as Sample
body{height:2000px}
.scrollTopWindow {
background-color: red;
width: 150px;
height: 100px;
color: white;
padding:20px;
}
HTML Code here
Some Content here
Some Content here
Some Content here
Some Content here
Some Content here
Some Content here
Some Content here
Some Content here
Some Content here
Some Content here
Some Content here
Some Content here
Some Content here
Some Content here
Some Content here
<div class = "scrollTopWindow"> Scroll top window and fix me ! </div>

Demo Jsfiddle

Tuesday, February 25, 2014

How to used in alert in java script


alert in java script
<script type="text/javascript">
            alert("Hello world !");
 </script>