Version Description
Download this release
Release Info
Developer | damiroquai |
Plugin | myStickymenu |
Version | 1.0 |
Comparing to | |
See all releases |
Version 1.0
- mystickymenu.css +38 -0
- mystickymenu.js +7 -0
- mystickymenu.php +33 -0
- readme.txt +36 -0
- screenshot-1.png +0 -0
- screenshot-2.png +0 -0
mystickymenu.css
ADDED
@@ -0,0 +1,38 @@
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
1 |
+
.navbar {
|
2 |
+
z-index: 100000;
|
3 |
+
/*add this line if you use 100% menu width, usually not needed*/
|
4 |
+
/*max-width: 100% !important;*/
|
5 |
+
text-transform:uppercase;
|
6 |
+
font-weight:bold;
|
7 |
+
-webkit-transition: 0.2s;
|
8 |
+
-moz-transition: 0.2s;
|
9 |
+
-o-transition: 0.2s;
|
10 |
+
transition: 0.2s;
|
11 |
+
}
|
12 |
+
.myfixed {
|
13 |
+
position: fixed;
|
14 |
+
top: 0;
|
15 |
+
-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=95)";
|
16 |
+
filter: alpha(opacity=95);
|
17 |
+
opacity:.95;
|
18 |
+
background-color: #C94812 !important;
|
19 |
+
}
|
20 |
+
.nav-menu li a:hover {
|
21 |
+
background-color: #111 !important;
|
22 |
+
-webkit-transition: 0.6s;
|
23 |
+
-moz-transition: 0.6s;
|
24 |
+
-o-transition: 0.6s;
|
25 |
+
transition: 0.6s;
|
26 |
+
}
|
27 |
+
.nav-menu .current_page_item > a,
|
28 |
+
.nav-menu .current_page_ancestor > a,
|
29 |
+
.nav-menu .current-menu-item > a,
|
30 |
+
.nav-menu .current-menu-ancestor > a {
|
31 |
+
color: #fff !important;
|
32 |
+
font-style: normal !important;
|
33 |
+
background-color:#111 !important;
|
34 |
+
}
|
35 |
+
#wpadminbar {
|
36 |
+
position: absolute !important;
|
37 |
+
top: 0px !important;
|
38 |
+
}
|
mystickymenu.js
ADDED
@@ -0,0 +1,7 @@
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
1 |
+
var navbar = document.querySelector('.navbar');
|
2 |
+
var origOffsetY = navbar.offsetTop;
|
3 |
+
function onScroll(e) {
|
4 |
+
window.scrollY >= origOffsetY ? navbar.classList.add('myfixed') :
|
5 |
+
navbar.classList.remove('myfixed');
|
6 |
+
}
|
7 |
+
document.addEventListener('scroll', onScroll);
|
mystickymenu.php
ADDED
@@ -0,0 +1,33 @@
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
1 |
+
<?php
|
2 |
+
/*
|
3 |
+
Plugin Name: myStickymenu
|
4 |
+
Plugin URI: http://wordpress.transformnews.com/plugins/mystickymenu-simple-sticky-fixed-on-top-menu-implementation-for-twentythirteen-menu-269
|
5 |
+
Description: Simple sticky (fixed on top) menu implementation for default Twentythirteen navigation menu. For other themes, if navigation class is different than .navbar change it to .your_navbar_class on the beggining of mystickymenu.js script ('.navbar') and inside mystickymenu.css.
|
6 |
+
Version: 1.0
|
7 |
+
Author: m.r.d.a
|
8 |
+
License: GPLv2 or later
|
9 |
+
*/
|
10 |
+
|
11 |
+
//remove default option for more link that jumps at the midle of page and its covered by menu
|
12 |
+
|
13 |
+
function remove_more_jump_link($link) {
|
14 |
+
$offset = strpos($link, '#more-');
|
15 |
+
if ($offset) {
|
16 |
+
$end = strpos($link, '"',$offset);
|
17 |
+
}
|
18 |
+
if ($end) {
|
19 |
+
$link = substr_replace($link, '', $offset, $end-$offset);
|
20 |
+
}
|
21 |
+
return $link;
|
22 |
+
}
|
23 |
+
add_filter('the_content_more_link', 'remove_more_jump_link');
|
24 |
+
|
25 |
+
function mystickymenu_script() {
|
26 |
+
|
27 |
+
wp_enqueue_style('mystickymenu',WP_PLUGIN_URL.'/mystickymenu/mystickymenu.css', false,'1.0.0');
|
28 |
+
wp_register_script('mystickymenu', WP_PLUGIN_URL. '/mystickymenu/mystickymenu.js', false,'1.0.0', true);
|
29 |
+
wp_enqueue_script( 'mystickymenu' );
|
30 |
+
|
31 |
+
}
|
32 |
+
add_action( 'wp_enqueue_scripts', 'mystickymenu_script' );
|
33 |
+
?>
|
readme.txt
ADDED
@@ -0,0 +1,36 @@
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
1 |
+
=== myStickymenu ===
|
2 |
+
Contributors: (Damiroquai)
|
3 |
+
Donate link: http://wordpress.transformnews.com
|
4 |
+
Tags: sticky menu, twentythirteen
|
5 |
+
Requires at least: 3.8
|
6 |
+
Tested up to: 3.8.1
|
7 |
+
Stable tag: 1.0
|
8 |
+
License: GPLv2 or later
|
9 |
+
|
10 |
+
This lightweight plugin will made your Twentythirteen menu sticky on top of page after scroll hits upper border.
|
11 |
+
|
12 |
+
== Description ==
|
13 |
+
Plugin is designed for Twentythirteen template but should work on any theme, it's using default twentythirteen ".navbar" css class and that should be modified for other themes if different.
|
14 |
+
|
15 |
+
Plugin Home + Demo URL: http://wordpress.transformnews.com/plugins/mystickymenu-simple-sticky-fixed-on-top-menu-implementation-for-twentythirteen-menu-269
|
16 |
+
|
17 |
+
|
18 |
+
== Installation ==
|
19 |
+
|
20 |
+
Install like any other plugin. After install activate.
|
21 |
+
|
22 |
+
If using template other than Twentythirteen open wp-content/plugins/mystickymenu/mystickymenu.js and edit selector class based on your template navigation bar class.
|
23 |
+
|
24 |
+
"var navbar = document.querySelector('.navbar');"
|
25 |
+
|
26 |
+
"var navbar = document.querySelector('.your_navbar_class');"
|
27 |
+
|
28 |
+
|
29 |
+
Edit /mystickymenu/mystickymenu.css to edit menu style, width, color...
|
30 |
+
Original javascript used from http://jsbin.com/omanut/2/edit
|
31 |
+
|
32 |
+
|
33 |
+
|
34 |
+
== Screenshots ==
|
35 |
+
1. screenshot-1.png in plugin folder shows menu when page is opened, and not scrolled.
|
36 |
+
2. screenshot-2.png shows menu when page is scrolled towards the bottom.
|
screenshot-1.png
ADDED
Binary file
|
screenshot-2.png
ADDED
Binary file
|