Μη Συνδεδεμενος Παρακαλώ συνδεθείτε ή εγγραφείτε

Επισκόπηση προηγούμενης Θ.Ενότητας Επισκόπηση επόμενης Θ.Ενότητας Πήγαινε κάτω  Μήνυμα [Σελίδα 1 από 1]

#1
 Admin

avatar
Admin


Γεια σας παιδιά! Εδώ θα μοιραστώ μαζί σας ένα πολύ ωραίο menu και πολύ βολικό εμφανίζεται μονο όταν το βελάκι περνάει από πάνω.

Κώδικας:
<style>
/* The CSS Code for the menu starts here greekport.gr */
ul.nav8 {
    list-style:none;
    height:120px;
    margin:0;
    padding:0;
}
ul.nav8 table {
    border-collapse:collapse;
    width:0;
    height:0;
    margin:-1px 0 -5px -1px;
}
ul.nav8 > li {
    float:right;
    height:120px;
    width:40px;
    position:relative;
    overflow:hidden;
    -webkit-transition-duration:.5s;
    -moz-transition-duration:.5s;
    -o-transition-duration:.5s;
}
* html ul.nav8 > li {
    width:auto;
}
ul.nav8 > li a.ie6 {
    float:left;
    height:120px;
    width:39px;
    position:relative;
    overflow:hidden;
}
ul.sub {
    list-style:none;
    height:120px;
    width:600px;
    background:url(http://www.script-tutorials.com/demos/107/images/panel.png) no-repeat right top;
    position:absolute;
    left:0;
    top:0;
    margin:0;
    padding:0;
}
ul.sub li {
    float:left;
}
ul.sub li:first-child {
    margin-left:45px;
}
ul.sub li a {
    display:block;
    width:110px;
    height:120px;
    float:left;
    overflow:hidden;
    position:relative;
    text-decoration:none;
    color:#000;
}
ul.sub li a b {
    font-size:14px;
    display:block;
    padding:15px 15px 5px;
}
ul.sub li a b:hover {
    font-size:16px;
    color:#FF0000;
    display:block;
    padding:15px 15px 5px;
}
ul.sub li a p {
    font-size:12px;
    display:block;
    margin:0;
    padding:0 10px;
}
ul.sub li a p:hover {
    font-size:13px;
    display:block;
    margin:0;
    padding:0 10px;
}
ul.nav8 > li:hover {
    width:600px;
}
ul.nav8 > li a.ie6:hover {
    direction:ltr;
    width:600px;
}
ul.sub li a:hover i {
    opacity:1.0;
}
</style>
<ul class="nav8">
        <li>
        <!--[if lte IE 6]><a class="ie6" href="#url"><table><tr><td><![endif]-->
            <ul class="sub">
                <li><a href="http://greeceport.malware-site.www"><b>Home</b><p>custom description here</p><i></i></a></li>
                <li><a href="http://greekport.gr"><b>Tutorials</b><p>custom description here</p><i></i></a></li>
                <li><a href="http://greekport.gr"><b>Support</b><p>custom description here</p><i></i></a></li>
                <li><a href="http://greekport.gr"><b>About</b><p>custom description here</p><i></i></a></li>
                <li><a href="http://greekport.gr"><b>Back</b><p>custom description here</p><i></i></a></li>
            </ul>
        <!--[if lte IE 6]></td></tr></table></a><![endif]-->
        </li>
    </ul>

Αλλάξτε το URL, τον τίτλο, και το κείμενο σας.

Αποθήκευση και είναι έτοιμο.

http://www.greekport.gr

Επισκόπηση προηγούμενης Θ.Ενότητας Επισκόπηση επόμενης Θ.Ενότητας Επιστροφή στην κορυφή  Μήνυμα [Σελίδα 1 από 1]


Δικαιώματα σας στην κατηγορία αυτή
Δεν μπορείτε να απαντήσετε στα Θέματα αυτής της Δ.Συζήτησης

Τρόποι Κοινοποίησης:
URL:
BBCode:
HTML: