18 Δεκ 2014
17 Δεκ 2014
Δείτε Ταινιές Οnline, σε Υψηλή ανάλυση, Δωρεάν με το PopCorn Time
Είναι μια Δωρεάν, τουλάχιστον προς το παρόν, εφαρμογή με την οποία μπορούμε να δούμε online σε υψηλή ανάλυση ταινίες και δημοφιλείς σειρές εύκολα, γρήγορα και με υπότιτλους (αν τους χρειάζεστε) ...
Αρκεί να επισκεφθούμε τη σελίδα και να πατήσουμε Download Beta 5.4 για να κατεβάσουμε το .exe αρχείο από το »popcorn-time«.
Αφού εγκαταστήσουμε -εύκολα- το λογισμικό ακολουθώντας τις οδηγίες, θα δημιουργηθεί εικονίδιο στην επιφάνεια εργασίας στο οποίο κάνουμε διπλό κλικ για να δούμε την αρχική σελίδα ...
όπου υπάρχουν άφθονα, θέματα που μπορούμε να διαλέξουμε για να παρακολουθήσουμε, μόλις σε 1-2 λεπτά.
Επιλέγοντας ανάλυση 720p η 1080p (προτιμήστε χαμηλότερη αν έχετε κάποιο πρόβλημα με την υψηλή), Subtitles για υπότιτλους και Watch Now για να δούμε την ταινία άμεσα. Μπορούμε να δούμε τρέιλερ της ταινίας με κλικ
στο Watch Trailer.
Αυτό είναι όλο!
Πάρτε μια ιδέα για την ποιότητα της εικόνας με ανάλυση 720p...
που σε real time και υψηλή (1080p), αν υποστηρίζει το σύστημά και η σύνδεση σας, θα είναι σαφώς καλύτερη.
Enjoy it!
16 Δεκ 2014
Οριζόντιο Dropdown Μενού με Submenu και Search Bar - Blogger
Ένα όμορφο μενού με υποκατηγορίες για κάθε κύρια κατηγορία και ενσωματωμένη Search Bar το οποίο έχω επιλέξει προσωπικά για το Blog μου, ελαφρώς τροποποιημένο. Τη διαδικασία εγκατάστασης δε θα τη χαρακτήριζε κανείς ''απλή'' αλλά πιστεύω ότι αξίζει τον κόπο. Δε θα αντιμετωπίσετε κανένα πρόβλημα αν ακολουθήσετε τα παρακάτω βήματα...
[Θα συνιστούσα σε όποιον δεν έχει εγκαταστήσει ένα πιο απλό μενού (χωρίς υποκατηγορίες) η δεν έχει τουλάχιστον στοιχειώδη εμπειρία να μην το προσπαθήσει γιατί πιθανότατα (όχι σίγουρα) θα μπερδευτεί].
Καταρχήν ανοίγουμε το Blogger μας και πάμε Πρότυπο Δημιουργία Αντιγράφου ασφαλείας (για κάθε ενδεχόμενο λάθους). Στη συνέχεια Επεξεργασία HTML και πατώντας Cntr+F βρίσκουμε το
<b:section class='tabs' id='crosscol' maxwidgets='1' showaddelement='yes'>
Απ΄ τον μικρούλη αυτόν κώδικα αφαιρούμε το class='tabs' (πιθανόν ο κώδικας να υπάρχει παραπάνω από μία φορές. Τον διαγράφουμε απ' όλες).
Στη συνέχεια βρίσκουμε το
/* Tabs
----------------------------------------------- */
και διαγράφουμε ότι υπάρχει ανάμεσα σ' αυτό και στο
/* Headings
----------------------------------------------- */
Παράδειγμα, αν ο αρχικός κώδικας ήταν αυτός
/* Tabs
----------------------------------------------- */
.tabs-outer {
overflow: hidden;
position: relative;
background: $(tabs.background.color) $(tabs.background.gradient) repeat scroll 0 0;
}
#layout .tabs-outer {
overflow: visible;
}
.tabs-cap-top, .tabs-cap-bottom {
position: absolute;
width: 100%;
border-top: 1px solid $(tabs.border.color);
}
.tabs-cap-bottom {
bottom: 0;
}
.tabs-inner .widget li a {
display: inline-block;
margin: 0;
padding: .6em 1.5em;
font: $(tabs.font);
color: $(tabs.text.color);
border-top: 1px solid $(tabs.border.color);
border-bottom: 1px solid $(tabs.border.color);
border-$startSide: 1px solid $(tabs.border.color);
}
.tabs-inner .widget li:last-child a {
border-$endSide: 1px solid $(tabs.border.color);
}
.tabs-inner .widget li.selected a, .tabs-inner .widget li a:hover {
background: $(tabs.selected.background.color) $(tabs.background.gradient) repeat-x scroll 0 -100px;
color: $(tabs.selected.text.color);
}
/* Headings
----------------------------------------------- */
θα πρέπει να μείνει αυτός
/* Tabs
----------------------------------------------- */
/* Headings
----------------------------------------------- */
Στη θέση αυτού που διαγράψαμε, επικολλούμε αυτό
#crosscol ul {z-index: 200; padding:0 !important;}
#crosscol li:hover {position:relative;}
#crosscol ul li {padding:0 !important;}
.tabs-outer {z-index:1;}
.tabs .widget ul, .tabs .widget ul {overflow: visible;}
Κατόπιν βρίσκουμε το
]]></b:skin>}
ακριβώς από πάνω του επικολλούμε αυτό
/* Horizontal drop down menu
----------------------------------------------- */
#menuWrapper {
width:100%; /* Menu width */
height:35px;
padding-left:14px;
background:#333; /* Background color */
border-radius: 10px;
}
.menu {
padding:0;
margin:0;
list-style:none;
height:35px;
position:relative;
z-index:5;
font-family:arial, verdana, sans-serif;
}
.menu li:hover li a {
background:none;
}
.menu li.top {display:block; float:left;}
.menu li a.top_link {
display:block;
float:left;
height:35px;
line-height:34px;
color:#ccc;
text-decoration:none;
font-family:"Verdana", sans-serif;
font-size:12px; /* Font size */
font-weight:bold;
padding:0 0 0 12px;
cursor:pointer;
}
.menu li a.top_link span {
float:left;
display:block;
padding:0 24px 0 12px;
height:35px;
}
.menu li a.top_link span.down {
float:left;
display:block;
padding:0 24px 0 12px;
height:35px;
}
.menu li a.top_link:hover, .menu li:hover > a.top_link {color:#fff; }
.menu li:hover {position:relative; z-index:2;}
.menu ul,
.menu li:hover ul ul,
.menu li:hover ul li:hover ul ul,
.menu li:hover ul li:hover ul li:hover ul ul,
.menu li:hover ul li:hover ul li:hover ul li:hover ul ul
{position:absolute; left:-9999px; top:-9999px; width:0; height:0; margin:0; padding:0; list-style:none;}
.menu li:hover ul.sub {
left:0;
top:35px;
background:#333; /* Submenu background color */
padding:3px;
white-space:nowrap;
width:200px;
height:auto;
z-index:3;
}
.menu li:hover ul.sub li {
display:block;
height:30px;
position:relative;
float:left;
width:200px;
font-weight:normal;
}
.menu li:hover ul.sub li a{
display:block;
height:30px;
width:200px;
line-height:30px;
text-indent:5px;
color:#ccc;
text-decoration:none;
}
.menu li ul.sub li a.fly {
/* Submenu Background Color */
background:#333 url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg0BM8H0EenlgXL-i4NGLPE-D08aXurvdLBWRjfvSDEx19N6CiMQP0AZZk0fKFOBXKd0RkDWsL4qOwZy5030sBTWw_aXddjv8uZks4MN587iVhjsMvpIF_bz1ObKti4wgXg7oLfq4Lk9jI/s1600/arrow_over.gif) 185px 10px no-repeat;}
.menu li:hover ul.sub li a:hover {
background:#515151; /* Background Color on mouseover */
color:#fff;
}
.menu li:hover ul.sub li a.fly:hover, .menu li:hover ul li:hover > a.fly {
/* Background on Mouseover */
background:#646464 url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg0BM8H0EenlgXL-i4NGLPE-D08aXurvdLBWRjfvSDEx19N6CiMQP0AZZk0fKFOBXKd0RkDWsL4qOwZy5030sBTWw_aXddjv8uZks4MN587iVhjsMvpIF_bz1ObKti4wgXg7oLfq4Lk9jI/s1600/arrow_over.gif) 185px 10px no-repeat; color:#fff;}
.menu li:hover ul li:hover ul,
.menu li:hover ul li:hover ul li:hover ul,
.menu li:hover ul li:hover ul li:hover ul li:hover ul,
.menu li:hover ul li:hover ul li:hover ul li:hover ul li:hover ul {
left:200px;
top:-4px;
background: #333; /* Background Color of the Submenu */
padding:3px;
white-space:nowrap;
width:200px;
z-index:4;
height:auto;
}
#search {
width: 228px; /* Width of the Search Box */
height: 50px;
float: right;
z-index: 2;
text-align: center;
margin-top: 5px;
margin-right: 6px;
/* Background of the Search Box */
background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEimPeJ6wNlcSPp25SS8bQe8HY0jOX8aJwT9kvGESkOlfdyQL1z-VjNHDMVmCgr1kK3-xavV1COzwlYO_g_bIXOtQFoOjIRLMnQ5wvBy2VsgQDvjY4gS7FE3IjXEzTn6KoM_R47U-SHuI9I/s1600/searchBar1.png) no-repeat;
}
#search-box {
margin-top: 3px;
border:0px;
background: transparent;
text-align:center;
}
και πατάμε Αποθήκευση Προτύπου.
Μετά, προσθέτουμε σαν Gadget τον παρακάτω κώδικα:
(Η διαδικασία είναι απλή και για τους περισσότερους γνωστή:
Αντιγραφή κώδικα -- Πίνακας Ελέγχου -- επιλέγουμε το Blogger μας -- Διάταξη -- Προσθήκη gadget -- HTML/JavaScript -- Επικόλληση κώδικα -- Αποθήκευση.)
<div id='menuWrapper'>
<ul class='menu'>
<li class='top'><a class='top_link' href='Link URL'><span>Title 1</span></a></li>
<li class='top'><a class='top_link' href='Link URL'><span class='down'>Title 2</span></a><ul class='sub'><li><a class='fly' href='Link URL'>Submenu 2.1</a><ul>
<li><a href='Link URL'>Submenu 2.1.1</a></li>
<li><a href='Link URL'>Submenu 2.1.2</a></li>
<li><a href='Link URL'>Submenu 2.1.3</a></li>
</ul>
</li>
<li class='mid'><a class='fly' href='Link URL'>Submenu 2.2</a>
<ul>
<li><a href='Link URL'>Submenu 2.2.1</a></li>
<li><a href='Link URL'>Submenu 2.2.2</a></li>
<li><a href='Link URL'>Submenu 2.2.3</a></li>
<li><a class='fly' href='Link URL'>Submenu 2.2.4</a>
<ul>
<li><a href='Link URL'>Submenu 2.2.4.1</a></li>
<li><a href='Link URL'>Submenu 2.2.4.2</a></li>
<li><a href='Link URL'>Submenu 2.2.4.3</a></li>
</ul>
</li>
<li><a href='Link URL'>Submenu 2.2.5</a></li>
<li><a class='fly' href='Link URL'>Submenu 2.2.6</a>
<ul>
<li><a href='Link URL'>Submenu 2.2.6.1</a></li>
<li><a href='Link URL'>Submenu 2.2.6.2</a></li>
</ul>
</li>
</ul>
</li>
<li><a href='Link URL'>Submenu 2.3</a></li>
<li><a href='Link URL'>Submenu 2.4</a></li>
<li><a href='Link URL'>Submenu 2.5</a></li>
</ul>
</li>
<li class='top'><a class='top_link' href='Link URL'><span class='down'>Title 3</span></a>
<ul class='sub'>
<li><a href='Link URL'>Submenu 3.1</a></li>
<li><a href='Link URL'>Submenu 3.2</a></li>
<li><a href='Link URL'>Submenu 3.3</a></li>
<li><a href='Link URL'>Submenu 3.4</a></li>
</ul>
</li>
<li class='top'><a class='top_link' href='Link URL'><span class='down'>Title 4</span></a>
<ul class='sub'>
<li><a href='Link URL'>Submenu 4.1</a></li>
<li><a class='fly' href='Link URL'>Submenu 4.2</a>
<ul>
<li><a href='Link URL'>Submenu 4.2.1</a></li>
<li><a href='Link URL'>Submenu 4.2.2</a></li>
<li><a href='Link URL'>Submenu 4.2.3</a></li>
<li><a href='Link URL'>Submenu 4.2.4</a></li>
<li><a href='Link URL'>Submenu 4.2.5</a></li>
<li><a href='Link URL'>Submenu 4.2.6</a></li>
</ul>
</li>
<li><a href='Link URL'>Submenu 4.3</a></li>
<li><a href='Link URL'>Submenu 4.4</a></li>
<li><a href='Link URL'>Submenu 4.5</a></li>
<li><a href='Link URL'>Submenu 4.6</a></li>
</ul>
</li>
<li class='top'><a class='top_link' href='Link URL'><span class='down'>Title 5</span></a>
<ul class='sub'>
<li><a href='Link URL'>Submenu 5.1</a></li>
<li><a href='Link URL'>Submenu 5.2</a></li>
<li><a href='Link URL'>Submenu 5.3</a></li>
</ul>
</li>
<!-- Search Bar -->
<li>
<form action='/search' id='search' method='get' name='searchForm' style='display:inline;'>
<input id='search-box' name='q' onblur='if (this.value == "") this.value = "Search here...";' onfocus='if (this.value == "Search here...") this.value = "";' size='28' type='text' value='Search here...'/></form>
</li>
</ul>
</div>
Πατάμε Αποθήκευση.
Εάν θέλουμε να προσθέσουμε κι άλλο link, πάνω απ' την Search Bar επικολλούμε αυτό
<li class="top"><a href="Link URL" class="top_link"><span>Title</span></a></li>
και για link με submenu αυτό
<li class="top"><a href="Link URL" class="top_link"><span class="down">Title</span></a>
<ul class="sub">
<li><a href="Link URL">Submenu Title</a></li>
<li><a href="Link URL">Submenu Title</a></li>
<li><a href="Link URL">Submenu Title</a></li>
</ul>
</li>
Για δεύτερη υποκατηγορία (υποκατηγορίες στην υποκατηγορία) θα πρέπει το
<li><a href="Link URL">Submenu Title</a></li>
να γίνει
<li><a href="Link URL" class="fly">Submenu Title</a>
<ul>
<li><a href="Link URL">Other Submenu</a></li>
<li><a href="Link URL">Other Submenu</a></li>
<li><a href="Link URL">Other Submenu</a></li>
</ul>
</li>
Θα δώσω 2 links σε όσους χρειάζονται πληροφορίες για το πως να προσθέσουν τα δικά τους links στον παραπάνω κώδικα, μιας και εγώ δεν έχω κάνει ανάρτηση για το συγκεκριμένο θέμα, ακόμη.
1) bloggertips.gr
2) Panagiotis Koursaris
Εγγραφή σε:
Αναρτήσεις (Atom)