Ads 468x60px

Featured Posts

  • Cougar

    Ενσωμάτωση υποτίτλων..

  • Lions

    Social network widget...

  • Snowalker

    Free Video to JPG Converter..

  • Howling

    Twitter Like box..Η λύση!!

  • Sunbathing

    JavaScript Image Slider ...

Πέμπτη, 19 Απριλίου 2018

Horizontal Iconic Menu

Φίλες και φίλοι γεια σας, σε αυτή την ανάρτηση θα δούμε ένα πολύ ωραίο και
πρωτότυπο οριζόντιο menu για τα blog μας!Η πρωτοτυπία του και η διαφορά του
με άλλα παρόμοια widgets είναι ότι στην αρχική του μορφή του, το menu
φαίνεται σαν κουμπί και μόλις "κλικάρετε" το κουμπί, αναπτύσσεται η μπάρα
με τις κατηγορίες!Σε αριστερή η δεξιά sidebar είναι δύσκολο να τοποθετηθεί
λόγω μεγέθους όταν αναπτύσσεται, εκτός αν έχετε μεγάλη sidebar η αφαιρέσετε
κατηγορίες από το menu!





 Η εγκατάσταση είναι απλή και

για να το εγκαταστήσετε και εσείς:
 
Πηγαίνετε blogger--> Διάταξη -->

Προσθήκη gadget-->HTML/JavaScript 

 και στο παράθυρο που θα ανοίξει επικολλήστε τον ακόλουθο κώδικα--

..............................................................................................................................................................

<style>

.iconicmenu {
    position: relative;
    height: 45px;
    overflow: hidden;
    }

.iconicmenu, .iconicmenu * {
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    }

.iconicmenu input[type="checkbox"] { /* checkbox used to toggle menu state */
    position: absolute;
    left: 0;
    top: 0;
    opacity: 0;
    }

.iconicmenu > label { /* Main label icon to toggle menu state */
    z-index: 1000;
    display: block;
    position: absolute;
    width: 40px;
    height: 40px;
    float: left;
    top: 0;
    left: 0;
    background: white;
    text-indent: -1000000px;
    border: 6px solid black; /* border color */
    border-width: 6px 0;
    cursor: pointer;
    -moz-transition: all 0.3s ease-in;
    -webkit-transition: all 0.3s ease-in;
    transition: all 0.3s ease-in; /* transition for flipping label */
    }

.iconicmenu > label::after { /* inner stripes inside label */
    content: "";
    display: block;
    position: absolute;
    width: 100%;
    height: 18%;
    top: 19%;
    left: 0;
    border: 6px solid black; /* border color */
    border-width: 6px 0;
    -moz-transition: all 0.3s ease-in;
    -webkit-transition: all 0.3s ease-in;
    transition: all 0.3s ease-in; /* transition for flipping label */
    }

.iconicmenu ul { /* UL menu inside container */
    margin: 0;
    padding: 0;
    position: absolute;
    margin-left: 40px;
    background: #eee;
    left: -100%; /* hide menu intially */
    height: 40px; /* height of menu */
    font: bold 14px Verdana;
    text-align: center;
    list-style: none;
    opacity: 0;
    -moz-border-radius: 0 5px 5px 0;
    -webkit-border-radius: 0 5px 5px 0;
    border-radius: 0 5px 5px 0;
    -moz-perspective: 10000px;
    perspective: 10000px;
    -moz-transition: all 0.5s ease-in;
    -webkit-transition: all 0.5s ease-in;
    transition: all 0.5s ease-in; /* transition for animating UL in and out */
    }

.iconicmenu li {
    display: inline;
    margin: 0;
    padding: 0;
    }

.iconicmenu ul label { /* label button inside UL to close menu */
    cursor: pointer;
    position: relative;
    height: 100%;
    text-align: center;
    }

.iconicmenu ul label::after { /* label button x */
    content: "x";
    display: inline-block;
    line-height: 14px;
    color: white;
    -moz-border-radius: 50px;
    -webkit-border-radius: 50px;
    border-radius: 50px;
    width: 20px;
    height: 20px;
    background: black;
    font-size: 18px;
    margin: 5px;
    margin-top: 10px;
    -moz-transition: all 0.3s ease-in;
    -webkit-transition: all 0.3s ease-in;
    transition: all 0.3s ease-in;
    }

.iconicmenu input[type="checkbox"]:checked ~ label, .iconicmenu ul label:hover::after {
    -moz-transform: rotatey(180deg);
    -ms-transform: rotatey(180deg);
    -webkit-transform: rotatey(180deg);
    transform: rotatey(180deg); /* flip labels vertically onMouseover */
    }

.iconicmenu > label:hover, .iconicmenu > label:hover::after, .iconicmenu input[type="

checkbox"]:checked ~ label, .iconicmenu input[type="checkbox"]:checked ~ label::after {
    border-color: darkred; /* highlight color of main menu label onMouseover */
    }

.iconicmenu input[type="checkbox"]:checked ~ ul {
    left: 8px; /* Animate menu into view */
    opacity: 1;
    -moz-box-shadow: 1px 1px 5px gray;
    -webkit-box-shadow: 1px 1px 5px gray;
    box-shadow: 1px 1px 5px gray;
    }

.iconicmenu li a {
    display: block;
    float: left;
    text-align: center;
    text-decoration: none;
    color: black;
    margin: 0;
    padding: 10px;
    padding-right: 15px;
    height: 100%;
    }

.iconicmenu li a:hover {
    background: black;
    color: white;
    }

/* ----------------------------- CSS Media Queries ----------------------------- */

/*
These rules control which portions of the menu gets shown when the screen size is below a certain width.
By default 2 stages are defined depending on browser screen width.
*/

@media screen and (max-width: 580px) { /* Hide toggle icon when menu is already open (increases usable menu space by 40px) */
    .iconicmenu input[type="checkbox"]:checked ~ label {
        display: none;
        }
    .iconicmenu input[type="checkbox"]:checked ~ ul {
        margin-left: 0;
        }
    }

@media screen and (max-width: 560px) { /* Convert horizontal menu to vertical drop down instead (friendly across all screen sizes) */
    .iconicmenu {
        overflow: visible;
        }
    .iconicmenu ul {
        height: auto;
        }
    .iconicmenu ul li {
        min-width: 200px;;
        display: block;
        }
    .iconicmenu ul li a {
        float: none;;
        text-align: left;
        }
    }


</style>

<!--[if lte IE 8]>
<style>

        .iconicmenu > label{
        border-width: 7px;
        background: #eee;
        }
      
        .iconicmenu:hover ul{
            left: 8px; /* show menu onmouseover in IE8 and below */
        }

</style>
<![endif]-->
<div class="iconicmenu">
<input type="checkbox" id="togglebox" />
<ul>
 
<li><a href="ΔΙΕΥΘΥΝΣΗ URL">ΤΙΤΛΟΣ</a></li>
<li><a href="
ΔΙΕΥΘΥΝΣΗ URL">ΤΙΤΛΟΣ</a></li>
<li><a href="
ΔΙΕΥΘΥΝΣΗ URL">ΤΙΤΛΟΣ</a></li>
<li><a href="
ΔΙΕΥΘΥΝΣΗ URL">ΤΙΤΛΟΣ</a></li>
<li><a href="ΔΙΕΥΘΥΝΣΗ URL">ΤΙΤΛΟΣ</a></li>
<li><label for="togglebox"></label></li>
</ul>
<label class="toggler" for="togglebox">Menu</label>
</div>

...............................................................................................................................................................

ΑΛΛΑΓΕΣ 

ΔΙΕΥΘΥΝΣΗ URL--Εδώ βάζετε το link της διεύθυνσης σας!
ΤΙΤΛΟΣ-- Εδώ βάζετε τον τίτλο σας! Αποθήκευση και έτοιμοι!

Εάν θέλετε να αφαιρέσετε Link για να μικρύνει το μενού η δεν θέλετε τόσες
κατηγορίες, τότε από τον κώδικα αφαιρείτε αυτήν την σειρά:

<li><a href="ΔΙΕΥΘΥΝΣΗ URL">ΤΙΤΛΟΣ</a></li> .Για κάθε κατηγορία και μία σειρά!


Καλή επιτυχία!!!


Πηγή κώδικα 
thanks to dynamicdrive.com



 Edit by

Τετάρτη, 18 Απριλίου 2018

Notice Board widget

Φίλες και φίλοι γεια σας, σε αυτή την ανάρτηση θα δούμε πως μπορούμε να
ενσωματώσουμε στην σελίδα μας ένα widget με το οποίο θέλουμε
να προβάλουμε - διαφημίσουμε κάτι που θέλουμε να προσέξουν οι αναγνώστες 
- επισκέπτες του blog μας, σε στυλ πίνακα (Notice board)!
Διαθέτει περιστρεφόμενο εφέ στο mouseover του κέρσορα μας και είναι ιδανικό
για να κάνει τους αναγνώστες μας να προσέξουν κάτι συγκεκριμένο που
θέλουμε!  



DEMO βλέπετε στην δεξιά sidebar του Tech Time εδώ, που έχω ενσωματώσει
την σελίδα μου στο Linkedin!


Η εγκατάσταση είναι απλή και

για να το εγκαταστήσετε και εσείς:
 
Πηγαίνετε blogger--> Διάταξη -->

Προσθήκη gadget-->HTML/JavaScript 

 και στο παράθυρο που θα ανοίξει επικολλήστε τον ακόλουθο κώδικα--

..............................................................................................................................................................

 <div dir="ltr" style="text-align: left;" trbidi="on">
<style>
.Bloggerspice{animation:WAKloading 4s;-webkit-animation:WAKloading 4s;-o-animation:WAKloading 4s-moz-animation:WAKloading 4s;-ms-animation:WAKloading 4s;animation:WAKloading 4s;float:left;margin-left:5px;margin-top:5px;width:272px;height:179px;border: 10px solid #111111; border-radius:10px; padding:10px;-webkit-transition:all 4s ease-in-out;-moz-transition:all 4s ease-in-out;-o-transition:all 4s ease-in-out;transition:all 4s ease-in-out;-webkit-transition:all .2s ease-in-out;-moz-transition:all .2s ease-in-out;-o-transition:all .2s ease-in-out;transition:all .2s ease-in-out;background:#660099 url(ΕΔΩ Η ΔΙΕΥΘΥΝΣΗ ΤΗΣ ΦΩΤΟΓΡΑΦΙΑ ΣΑΣ)no-repeat center;background-size:250px;}
.Bloggerspice:hover{-webkit-transform:rotateY(180deg);-moz-transform:rotateY(180deg);-o-transform:rotateY(180deg);transform:rotateY(180deg);
border-radius: 10px;
border: 10px solid #111111;
}/*widget by  www.bloggerspice.com  */
</style>
<div>
<a class="Bloggerspice" href="ΕΔΩ ΤΟ URL ΤΗΣ ΔΙΕΥΘΥΝΣΗΣ ΣΑΣ"></a>
</div>
</div>

.....................................................................................................................................................................
ΑΛΛΑΓΕΣ

Βάζετε την διεύθυνση της εικόνα σας, και το url της διεύθυνσης που θέλετε στα 

αντίστοιχα σημεία του κώδικα και πατάτε Αποθήκευση!!

Καλή επιτυχία!!! 


 Πηγή κώδικα
thanks to bloggerspice.com



 Edit by

Τρίτη, 3 Απριλίου 2018

Drop down Box viewer

Φίλες και φίλοι γεια σας, σε αυτή την ανάρτηση θα δούμε ένα drop down box το
οποίο μας χρησιμεύει στο να παρουσιάζουμε ξεχωριστά θέματα μέσα από το blog
μας, παραμένοντας όμως σε αυτό!Εάν έχετε χώρο στο blog σας η θέλετε να
εμπλουτίσετε το template σας, και έχετε πολλά blogs, στατικές σελίδες, μεγάλα
κείμενα, φωτογραφίες υψηλής ανάλυσης κτλ κτλ τότε αυτό το drop down box θα σας
φανεί αρκετά χρήσιμο!Δεν καθυστερεί καθόλου το άνοιγμα της σελίδας σας,  γιατί παραμένει
κενό, μέχρι να κλικάρετε κάποια επιλογή!!







και για να το εγκαταστήσετε και εσείς

Πηγαίνετε blogger--> Διάταξη -->

Προσθήκη gadget-->HTML/JavaScript 

 και στο παράθυρο που θα ανοίξει επικολλήστε τον ακόλουθο κώδικα--
..................................................................................................................................................

<!--CHANGE LINKS BELOW TO YOUR OWN-->
<a href="javascript:jumpto('ΕΔΩ ΒΑΖΕΤΕ ΤΗΝ ΔΙΕΥΘΥΝΣΗ ΣΑΣ')">ΕΔΩ Ο ΤΙΤΛΟΣ ΣΑΣ</a> |
<a href="javascript:jumpto('
ΕΔΩ ΒΑΖΕΤΕ ΤΗΝ ΔΙΕΥΘΥΝΣΗ ΣΑΣ')">ΕΔΩ Ο ΤΙΤΛΟΣ ΣΑΣ</a> | <a href="javascript:jumpto('ΕΔΩ ΒΑΖΕΤΕ ΤΗΝ ΔΙΕΥΘΥΝΣΗ ΣΑΣ')">ΕΔΩ Ο ΤΙΤΛΟΣ ΣΑΣ</a> | <a href="javascript:jumpto('ΕΔΩ ΒΑΖΕΤΕ ΤΗΝ ΔΙΕΥΘΥΝΣΗ ΣΑΣ')">ΕΔΩ Ο ΤΙΤΛΟΣ ΣΑΣ</a>
<script language="javascript">
<!--

//Drop-down Document Viewer II- © Dynamic Drive (www.dynamicdrive.com)
//For full source code, 100's more DHTML scripts, and TOS,
//visit http://www.dynamicdrive.com

//Specify display mode (0 or 1)
//0 causes document to be displayed in an inline frame, while 1 in a new browser window
var displaymode=0
//if displaymode=0, configure inline frame attributes (ie: dimensions, intial document shown
var iframecode='<iframe id="external" style="width:95%;height:400px" src="http://www.yahoo.com"></iframe>'

/////NO NEED TO EDIT BELOW HERE////////////

if (displaymode==0)
document.write(iframecode)

function jumpto(inputurl){
if (document.getElementById&&displaymode==0)
document.getElementById("external").src=inputurl
else if (document.all&&displaymode==0)
document.all.external.src=inputurl
else{
if (!window.win2||win2.closed)
win2=window.open(inputurl)
//else if win2 already exists
else{
win2.location=inputurl
win2.focus()
}
}
}
//-->
</script>

...................................................................................................................................................
ΑΛΛΑΓΕΣ

ΕΔΩ ΒΑΖΕΤΕ ΤΗΝ ΔΙΕΥΘΥΝΣΗ ΣΑΣ - Εδώ βάζετε το url της διεύθυνση σας!

ΕΔΩ Ο ΤΙΤΛΟΣ ΣΑΣ - Εδώ βάζετε τον τίτλο που θα φαίνεται!

Εάν θέλετε να προσθέσετε και άλλα Links απλά επαναλαμβάνετε την σειρα:

<a href="javascript:jumpto('ΕΔΩ ΒΑΖΕΤΕ ΤΗΝ ΔΙΕΥΘΥΝΣΗ ΣΑΣ')">ΕΔΩ Ο ΤΙΤΛΟΣ ΣΑΣ</a>

Μόλις τελειώσετε Αποθήκευση και είστε έτοιμοι!! 


Καλή επιτυχία!!! 


Πηγή κώδικα
thanks to dynamicdrive.com



Edit by

Δευτέρα, 2 Απριλίου 2018

PDF to Word

Φίλες και φίλοι γεια σας, σε αυτή την ανάρτηση θα δούμε ακόμα μία online 
υπηρεσία την ιστοσελίδα pdftoword.com η οποία μάς βοηθά να μετατρέψουμε
τα pdf αρχεία μας σε αρχεία word, power point, excell και το αντίστροφο!Κάποιες
φορές μπορεί να είναι αδύνατη η μετατροπή λόγω διαφόρων παραγόντων, αλλά αυτό
συμβαίνει ενίοτε ακόμα και σε εγκατεστημένα προγράμματα!



Η διαδικασία είναι πολύ απλή, απλά κάνουμε upload το αρχείο μας στην ιστοσελίδα




διαλέγουμε στο τι θέλουμε να το μετατρέψουμε, δίνουμε ένα ΕΓΚΥΡΟ email 
μας, και πατάμε 

                                 Convert it






Μόλις αρχίσει η μετατροπή βλέπουμε αυτή την ειδοποίηση





και μόλις τελειώσει η μετατροπή βλέπουμε






και στο email  που δώσαμε μας έρχεται το εξής:




Πατώντας το Get your File κάνετε download το αρχείο που μετατρέψατε!Μπορείτε
να κάνετε και έναν free λογαριασμό για να αποφύγετε και κάποιους περιορισμούς
αλλά και για μερικά extra!

Καλή επιτυχία!!! 



 Edit by

Τετάρτη, 28 Μαρτίου 2018

LockHunter / Διαγραφή αρχείων

Φίλες και φίλοι γεια σας, σε αυτή την ανάρτηση θα δούμε το LockHunter το οποίο

είναι μια πάρα πολύ χρήσιμη εφαρμογή που μας βοηθά να διαχειριζόμαστε

αρχεία, που έχουν κλειδωθεί από το λειτουργικό μας και δεν μπορούμε να τα

διαγράψουμε με τους κοινούς τρόπους!Μοιάζει λίγο με το Unlocker που έχω

κάνει ανάρτηση ΕΔΩ! Παρέχει λεπτομερείς πληροφορίες για το κλείδωμα

ενός φακέλου και η διαφορά του με τα άλλα παρόμοια προγράμματα είναι

ο,τι τα διαγραμμένα αρχεία πάνε στον κάδο ανακύκλωσης, έτσι ώστε να υπάρχει η δυνατότητα να

επαναφερθούν σε περίπτωση λάθους!

Μπορείτε να το κατεβάσετε από ΕΔΩ


Μόλις κατέβει διπλό κλικ στο αρχείο, Επόμενο, Επόμενο, Finish!

Δημιουργεί συντόμευση στο μενού του explorer και μπορείτε να την
δείτε με δεξί κλικ!

Δείτε πως λειτουργεί:






Και να μην μπορέσετε να διαγράψετε κάποιο αρχείο για άγνωστο λόγο, τουλάχιστον
προσπαθήσατε πέρα από τους κοινούς τρόπους!

Homepage

Μέγεθος:2.9 ΜΒ

Windows all


Καλή επιτυχία!!!


Edit by

Δευτέρα, 26 Μαρτίου 2018

Subscription Gadget With Rollover Effect

Φίλες και φίλοι γεια σας, σε αυτή την ανάρτηση θα δούμε ακόμα ένα gadget με ενσωματωμένα social media urls
!Έχει icons για Facebook  Twitter και Rss!Μπαίνει σε οποιοδήποτε
σημείο του blog μας και διαθέτει και ένα πολύ ωραίο rollover effect!




Δείτε το παράδειγμα:





Η εγκατάσταση είναι πάρα πολύ απλή και για να γίνει...

Πηγαίνετε blogger--> Διάταξη -->

Προσθήκη gadget-->HTML/JavaScript 

 και στο παράθυρο που θα ανοίξει επικολλήστε τον ακόλουθο κώδικα--
.............................................................................................................................................................
 <a href=http://www.facebook.com/username facebook onmouseover= "if (document.images) document.facebook.src= 'http://1.bp.blogspot.com/-23R7iMQYXos/TcCnWEQwPtI/AAAAAAAADlc/jGPp-_QBi8Y/s1600/facebook.png';" onmouseout= "if (document.images) document.facebook.src= 'http://4.bp.blogspot.com/-OlVAPY5N4DU/TcCr-NGtkrI/AAAAAAAADlw/TYJpdwMUpwU/s1600/facebook.png';"><img src="http://4.bp.blogspot.com/-OlVAPY5N4DU/TcCr-NGtkrI/AAAAAAAADlw/TYJpdwMUpwU/s1600/facebook.png" name="facebook" border="0" width="64" height="82"/></a>
<a href=http://twitter.com/username twitter onmouseover= "if (document.images) document.twitter.src= 'http://2.bp.blogspot.com/-QBSeBdg2pn8/TcCqOfT-6SI/AAAAAAAADlo/ks47LssGaRs/s320/twitter.png';" onmouseout= "if (document.images) document.twitter.src= 'http://2.bp.blogspot.com/-zpBYTS7b0Kw/TcCsDEBdHqI/AAAAAAAADl4/j3TvkL4luC0/s1600/twitter.png';"><img src="http://2.bp.blogspot.com/-zpBYTS7b0Kw/TcCsDEBdHqI/AAAAAAAADl4/j3TvkL4luC0/s1600/twitter.png" name="twitter" border="0" width="64" height="82"/></a>
<a href=http://feeds.feedburner.com/username feed onmouseover= "if (document.images) document.rss.src= 'http://2.bp.blogspot.com/-SJF6UBDPtmU/TcCnWl9-gaI/AAAAAAAADlg/NVgsWS3Kefk/s1600/rss.png';" onmouseout= "if (document.images) document.rss.src= 'http://1.bp.blogspot.com/-34I9Zv8nr0k/TcCsCJjlt3I/AAAAAAAADl0/Hmioi9iUEnU/s1600/rss.png';"><img src="http://1.bp.blogspot.com/-34I9Zv8nr0k/TcCsCJjlt3I/AAAAAAAADl0/Hmioi9iUEnU/s1600/rss.png" name="rss" border="0" width="64" height="82"/></a><br/><a href="http://www.spiceupyourblog.com" target="_blank"><small>Blog Gadgets</small></a>
..............................................................................................................................................................
AΛΛΑΓΕΣ 

Αντικαταστήστε όλα τα username με τα αντίστοιχα δικά σας και πατήστε Αποθήκευση!

Καλή επιτυχία!!! 


Πηγή κώδικα 
thanks to spiceupyourblog.com



Edit by

Σάββατο, 17 Μαρτίου 2018

Pdfescape

Φίλες και φίλοι γεια σας, σε αυτή την ανάρτηση θα δούμε μία online υπηρεσία
την ιστοσελίδα Pdfescape η οποία μας βοηθά και επιτρέπει να μπορούμε να
επεξεργαζόμαστε Pdf αρχεία!Χωρίς περιττές εγκαταστάσεις και περίπλοκες
λειτουργίες με ένα απλό upload των pdf αρχείων μας μπορούμε να τα διαβάσουμε
και να τα επεξεργαστούμε!Όποιος θέλει βέβαια 
μπορεί
να κατεβάσει και την free edition
του editor που δίνουν από την ιστοσελίδα.



Δείτε εδώ μερικά που μπορούμε να κάνουμε στην ιστοσελίδα Pdfescape




Annotate PDF Documents

Create New PDF Forms

Edit PDF Files

Fill Out PDF Forms

Password Protect PDF Content

Share PDF Documents

Save & Print PDF Files

View PDF Files Online








 Απλά κάνετε upload τα αρχεία σας και διαλέγετε το τι θέλετε να κάνετε!Μπορείτε
να δημιουργήσετε και έναν free λογαριασμό!!


Καλή επιτυχία!!!


Homepage

Edit by

Τρίτη, 13 Μαρτίου 2018

Mini Social Icons With CSS

Φίλες και φίλοι γεια σας, σε αυτήν την ανάρτηση θα δούμε ένα widget bar με social icons,
διαφορετικό ως προς το μέγεθος από τις άλλες αναρτήσεις που έχουμε αναρτήσει με ένα πολύ ωραίο
Sprite Flip Effect κάνοντας την συγκεκριμένη social bar  ιδανική, έτσι ώστε να μπορούμε να την χρησιμοποιήσουμε μαζί με άλλην
στο blog μας, λόγω του μικρού μεγέθους της!Αριστερά, Δεξιά, κάτω στο footer, μπαίνει
παντού!


Δείτε εδώ το  DEMO




και για να το εγκαταστήσετε και εσείς στο blog σας....

  

Πηγαίνετε blogger--> Διάταξη -->

Προσθήκη gadget-->HTML/JavaScript 

 και στο παράθυρο που θα ανοίξει επικολλήστε τον ακόλουθο κώδικα--
..........................................................................................................................

 <ul class="spicesocialwidget">
<li class="facebook">
<a rel="nofollow" href="http://www.facebook.com/" target="_blank" title="facebook">
</a></li>
<li class="googleplus">
<a rel="nofollow" href="https://plus.google.com/" target="_blank" title="googleplus">
</a></li>
<li class="twitter">
<a rel="nofollow" href="http://twitter.com/" target="_blank" title="twitter">
</a></li>
<li class="rss">
<a rel="nofollow" href="http://feedburner.com/" target="_blank" title="rss">
</a></li>
<li class="skype">
<a rel="nofollow" href="http://www.skype.com/" target="_blank" title="Skype">
</a></li>
<li class="flickr">
<a rel="nofollow" href="http://www.flickr.com/" target="_blank" title="flickr">
</a></li>
<li class="linkedin">
<a rel="nofollow" href="http://www.linkedin.com/" target="_blank" title="linkedin">
</a></li>
<li class="youtube">
<a rel="nofollow" href="http://www.youtube.com/" target="_blank" title="youtube">
</a></li>
</ul>
<style>
ul.spicesocialwidget {float:right;}
ul.spicesocialwidget li {float:left;list-style: none outside none;border:none;}
ul.spicesocialwidget li a{background-color:transparent;background-image:url('http://4.bp.blogspot.com/-Pe-J5S7YCa0/UdXsJoN7GLI/AAAAAAAAL68/ongZAtcNF1E/s1600/spice-social-gadget-sprite.png');background-repeat:no-repeat;background-size:auto 96px;border:0 none;color:white;direction:ltr;display:block; height:32px;overflow:hidden;text-align:left;text-decoration:none;text-indent:-999em;transition:all 0.2s ease 0s;width:32px}
.ie7 ul.spicesocialwidget li a, .ie8 ul.spicesocialwidget li a{background-image:url('http://4.bp.blogspot.com/-Pe-J5S7YCa0/UdXsJoN7GLI/AAAAAAAAL68/ongZAtcNF1E/s1600/spice-social-gadget-sprite.png' )}
ul.spicesocialwidget li.facebook a{ background-position:0 0}
ul.spicesocialwidget li.flickr a{ background-position:-32px 0}
ul.spicesocialwidget li.dribbble a{ background-position:-64px 0}
ul.spicesocialwidget li.googleplus a{ background-position:-96px 0}
ul.spicesocialwidget li.linkedin a{ background-position:-128px 0}
ul.spicesocialwidget li.pinterest a{ background-position:-160px 0}
ul.spicesocialwidget li.rss a{ background-position:-192px 0}
ul.spicesocialwidget li.skype a{ background-position:-224px 0}
ul.spicesocialwidget li.twitter a{ background-position:-256px 0}
ul.spicesocialwidget li.vimeo a{ background-position:-288px 0}
ul.spicesocialwidget li.youtube a{ background-position:-320px 0}
ul.spicesocialwidget li.facebook a:hover, #sidebar ul.spicesocialwidget li.facebook a:hover{ background-position:0 -32px}
ul.spicesocialwidget li.flickr a:hover, #sidebar ul.spicesocialwidget li.flickr a:hover{ background-position:-32px -32px}
ul.spicesocialwidget li.googleplus a:hover, #sidebar ul.spicesocialwidget li.googleplus a:hover{ background-position:-96px -32px}
ul.spicesocialwidget li.linkedin a:hover, #sidebar ul.spicesocialwidget li.linkedin a:hover{ background-position:-128px -32px}
ul.spicesocialwidget li.rss a:hover, #sidebar ul.spicesocialwidget li.rss a:hover{ background-position:-192px -32px}
ul.spicesocialwidget li.skype a:hover, #sidebar ul.spicesocialwidget li.skype a:hover{ background-position:-224px -32px}
ul.spicesocialwidget li.twitter a:hover, #sidebar ul.spicesocialwidget li.twitter a:hover{ background-position:-256px -32px}
ul.spicesocialwidget li.youtube a:hover, #sidebar ul.spicesocialwidget li.youtube a:hover{ background-position:-320px -32px}
</style>

..........................................................................................................................................................
ΑΛΛΑΓΕΣ

Βάζετε τα δικά σας αντίστοιχα urls των social media στα υπογραμμισμένα πεδία και
πατάτε Αποθήκευση!!Αυτό ήταν!

Έχω αφαιρέσει τα-vimeo-pinterest-dribble από τον κώδικα της μπάρας!Εάν θέλετε κάποιο
από αυτά μπορείτε από την πηγή που δίνω στο τέλος της ανάρτησης να χρησιμοποιήσετε
ατόφιο τον κώδικα!!

Αν θέλετε να αφαιρέσετε και άλλα πχ το flickr,
Αφαιρείτε αυτό 

<li class="flickr">
<a rel="nofollow" href="http://www.flickr.com/" target="_blank" title="flickr">
</a></li>


και αυτό 

ul.spicesocialwidget li.flickr a:hover, #sidebar ul.spicesocialwidget li.flickr a:hover{ background-position:-32px -32px}

 Καλή επιτυχία!!!




Πηγή κώδικα 
thanks to spiceupyourblog.com









Edit by

Παρασκευή, 2 Μαρτίου 2018

Free Privacy Eraser

Φίλες και φίλοι γεια σας σε αυτή την ανάρτηση θα δούμε το Free Privacy Eraser, ένα
πολύ καλό cleaner(καθαριστικό) πρόγραμμα για το καθάρισμα και την ιδιωτικότητα μας! Η κύρια
λειτουργία του είναι να καθαρίζει τους browsers μας από όλη τους την κίνηση - σερφάρισμα στο διαδίκτυο, όσο είναι δυνατό
αυτό !

Ελαφρύ, μικρό, αλλά θαυματουργό cleaner!

                                     

Μπορείτε να το κατεβάσετε από ΕΔΩ


Απλό setup είναι:


Στην ακόλουθη εικόνα βλέπουμε πως ξεκινά το πρόγραμμα:





Μόλις τελειώσει το Test πατάμε Clean και ο καθαρισμός αρχίζει


Μην ξεχνάτε να διαλέγετε πάντα από αριστερά τους browsers και να "κλικάρετε" τα
κουτάκια που θέλετε για το καθάρισμα!Είναι πολύ εύκολο στην χρήση του!

Καλή επιτυχία!!





Edit by 


Icon Icon Icon

spice up your blog