ब्लॉगगर के लिए उलटी गिनती गैजेट जोड़ें

मनोज जैसवाल : सभी पाठकों को मेरा प्यार भरा नमस्कार नया साल आने बाला है आज पेश है ब्लॉगगर के लिए उलटी गिनती विजेट इसे लगाना बेहद आसान है इसके आपको अपने टेमप्लेट में कोई बदलाब नहीं करना पडेगा   इसे आप हर किसी भी उत्सव में उपयोग कर सकते है इसका बिवरण आप नीचे दिया  गया है इसे 25 दिसंबर के लिए सेट किया गया है आप चाहे तो इसमे मन मुताबिक बदलाव कर सकते है उलटी गिनती विजेट नीचे की गिनती दिन, घंटे, मिनट और सेकंड द्वारा 25 दिसम्बर 2011 और  समय स्वरूप में गिना जाता है यह भी अलर्ट है और समाप्त होता है नीचे गिनती एक बार एक पॉप अप उत्पन्न करके जावास्क्रिप्ट द्वारा प्रदान की गई है गतिशील ड्राइव और यह स्टाइल और MBT वेबसाईट(एक अंगरेजी वेबसाईट)  से साभार लिया गया है  इस विजेट प्रत्येक घटना पर साझा किया जा सकता है  यहाँ यह ईद, होली या नव वर्ष का हो सकता है

क्रिसमस उलटी गिनती विजेट

डेमो लाइव




Add CountDown Gadget To Blogspot

  1. अपने ब्लॉगगर एकाउंट में लॉन्ग इन करे. Go To Blogger > Design
  2. एड विजेट html जाबा स्क्रिप्ट्स का चयन करे. Choose HTML/JavaScript widget
  3. नीचे दिया कोड खुले बॉक्स में डाल कर सेव करे. Paste the following code inside it,




<style style="text/css">
.lcdstyle{ /*Example CSS to create LCD countdown look*/
background-color:fff;
color:#FF3333;
font: bold 20px arial;
padding: 15px;
border:5px solid #0080ff;
border-radius:15px;
-moz-border-radius:15px;
-webkit-border-radius:15px;
box-shadow: 5px 5px 5px #CCCCCC;

}
.lcdstyle sup{ /*Example CSS to create LCD countdown look*/
font-size: 120%
}
</style>
<script type="text/javascript">
/***********************************************
* Dynamic Countdown script- © Dynamic Drive (http://www.dynamicdrive.com)
* This notice MUST stay intact for legal use
* Visit http://www.dynamicdrive.com/ for this script and 100s more.
***********************************************/
function cdtime(container, targetdate){
if (!document.getElementById || !document.getElementById(container)) return
this.container=document.getElementById(container)
this.currentTime=new Date()
this.targetdate=new Date(targetdate)
this.timesup=false
this.updateTime()
}
cdtime.prototype.updateTime=function(){
var thisobj=this
this.currentTime.setSeconds(this.currentTime.getSeconds()+1)
setTimeout(function(){thisobj.updateTime()}, 1000) //update time every second
}
cdtime.prototype.displaycountdown=function(baseunit, functionref){
this.baseunit=baseunit
this.formatresults=functionref
this.showresults()
}
cdtime.prototype.showresults=function(){
var thisobj=this

var timediff=(this.targetdate-this.currentTime)/1000 //difference btw target date and current date, in seconds
if (timediff<0){ //if time is up
this.timesup=true
this.container.innerHTML=this.formatresults()
return
}
var oneMinute=60 //minute unit in seconds
var oneHour=60*60 //hour unit in seconds
var oneDay=60*60*24 //day unit in seconds
var dayfield=Math.floor(timediff/oneDay)
var hourfield=Math.floor((timediff-dayfield*oneDay)/oneHour)
var minutefield=Math.floor((timediff-dayfield*oneDay-hourfield*oneHour)/oneMinute)
var secondfield=Math.floor((timediff-dayfield*oneDay-hourfield*oneHour-minutefield*oneMinute))
if (this.baseunit=="hours"){ //if base unit is hours, set "hourfield" to be topmost level
hourfield=dayfield*24+hourfield
dayfield="n/a"
}
else if (this.baseunit=="minutes"){ //if base unit is minutes, set "minutefield" to be topmost level
minutefield=dayfield*24*60+hourfield*60+minutefield
dayfield=hourfield="n/a"
}
else if (this.baseunit=="seconds"){ //if base unit is seconds, set "secondfield" to be topmost level
var secondfield=timediff
dayfield=hourfield=minutefield="n/a"
}
this.container.innerHTML=this.formatresults(dayfield, hourfield, minutefield, secondfield)
setTimeout(function(){thisobj.showresults()}, 1000) //update results every second
}
/////CUSTOM FORMAT OUTPUT FUNCTIONS BELOW//////////////////////////////
//Create your own custom format function to pass into cdtime.displaycountdown()
//Use arguments[0] to access "Days" left
//Use arguments[1] to access "Hours" left
//Use arguments[2] to access "Minutes" left
//Use arguments[3] to access "Seconds" left
//The values of these arguments may change depending on the "baseunit" parameter of cdtime.displaycountdown()
//For example, if "baseunit" is set to "hours", arguments[0] becomes meaningless and contains "n/a"
//For example, if "baseunit" is set to "minutes", arguments[0] and arguments[1] become meaningless etc

function formatresults(){
if (this.timesup==false){//if target date/time not yet met
var displaystring=arguments[0]+" days "+arguments[1]+" hours "+arguments[2]+" minutes "+arguments[3]+" seconds left until December 25, 2011 18:25:00"
}
else{ //else if target date/time met
var displaystring=""
}
return displaystring
}
function formatresults2(){
if (this.timesup==false){ //if target date/time not yet met
var displaystring="<span class='lcdstyle'>"+arguments[0]+" <sup>days</sup> "+arguments[1]+" <sup>hours</sup> "+arguments[2]+" <sup>minutes</sup> "+arguments[3]+" <sup>seconds</sup></span> "
}
else{ //else if target date/time met
var displaystring="" //Don't display any text
alert("Christmas is here!") //Instead, perform a custom alert
}
return displaystring
}
</script>

<h1 style="color:#0080ff; margin:0;">Happy Holidays!</h1>
<div id="countdowncontainer"></div>
<br />
<div id="countdowncontainer2"></div>
<script type="text/javascript">
var futuredate=new cdtime("countdowncontainer", "March 23, 2009 18:25:00")
futuredate.displaycountdown("days", formatresults)
var currentyear=new Date().getFullYear()
//dynamically get this Christmas' year value. If Christmas already passed, then year=current year+1
var thischristmasyear=(new Date().getMonth()>=11 && new Date().getDate()>25)? currentyear+1 : currentyear
var christmas=new cdtime("countdowncontainer2", "December 25, "+thischristmasyear+" 0:0:00")
christmas.displaycountdown("days", formatresults2)
</script>




अपने रंग और फ़ॉन्ट आदि में  आप चाहें तो यह  परिवर्तन करें:
  • का रंग बदलने color:#0080ff
  •  नीले बॉर्डर रंग और आकार संपादित को बदलनेके लिए border:5px solid #0080ff
  • पाठ रंग संपादित करें नीचे गणना बदलने के लिएcolor:#FF3333 
  •  दिनांक  बदलने के लिए December 25
    4. अपने विजेट को सहेजें


View Image in New Window क्या आपको यह लेख पसंद आया? अगर हां, तो ...इस ब्लॉग के प्रशंसक बनिए !!
इस पोस्ट का शार्ट यूआरएल चाहिए: यहाँ क्लिक करें। Sending request...
Comment With:
OR
The Choice is Yours!

11 कमेंट्स “ब्लॉगगर के लिए उलटी गिनती गैजेट जोड़ें”पर

  1. शानदार बिजेट के लिए धन्यबाद.

    ReplyDelete
  2. बेहतरीन जानकारी आपका आभार मनोज जी.

    ReplyDelete
  3. पोस्ट पर राय के लिए आप सब का धन्यबाद।

    ReplyDelete
  4. very nice,यह एक अच्छी बात है कि आपने बता दिया कोड आपने नहीं बनाया.इसके लिए साधुबाद.

    ReplyDelete
  5. क्या किसी भी विशेष पर्ब या आयोजन के पहले इसे लगाया जा सकता है ?

    ReplyDelete
  6. जी हाँ आप इसे किसी भी समय इस विजेट का प्रयोग कर सकती है।

    ReplyDelete
  7. बिजेट के लिए धन्यबाद.

    ReplyDelete
  8. बिजेट के लिए धन्यबाद मनोज जी .

    ReplyDelete
  9. सुन्दर बिजेट आपका आभार.

    ReplyDelete
  10. शानदार बिजेट

    ReplyDelete
  11. सुन्दर बिजेट

    ReplyDelete

Widget by:Manojjaiswal
Related Posts Plugin for WordPress, Blogger...
  • रफ़्तार
  • Online Marketing
    Praca poznań w Zarabiaj.pl
    Technology-Internet blog
     

    Blog Directories

    क्लिक >>

    About The Author

    Manoj jaiswal

    Man

    Behind

    This Blog

    Manoj jaiswal

    is a 56 years old Blogger.He loves to write about Blogging Tips, Designing & Blogger Tutorials,Templates and SEO.

    Read More.

    ब्लॉगर द्वारा संचालित|Template Style by manojjaiswalpbt | Design by Manoj jaiswal | तकनीक © . All Rights Reserved |