Home JS special effects jQuery effects jQuery page scrolling top navigation code

jQuery page scrolling top navigation code

jQuery page scrolling top navigation code

jQuery page scrolling top navigation code

The jQuery page scrolling to the top navigation code is a navigation code that floats the positioning menu with the browser scroll bar and fixes the menu to the top of the web page.
<style type="text/css">
*{ margin:0; padding:0;}
body{ background:#eee; text-shadow:0px 1px 0px rgba(255,255,255,0.60); color:#333;}
a{color:#fff; text-decoration:none;}
#header{display:block; height:200px; background:#7fcddd; line-height:100px; text-align:center; color:#fff; font-size:16px;text-shadow:0px -1px 0px rgba(30 ,30,30,0.60);}
#header h3{font-size:50px; font-weight:600;height:120px; line-height:120px;}
#box{ width:980px; margin:60px auto; height:2600px; background:#eee;}

/* Navigation part */
#mynav{ width:100%; height:40px; background:#2093e0; border-bottom:1px solid #fff; position:relative; z-index:99; color:#fff; line-height:40px;}
#mynav ul{width:1000px; padding:0; margin:0 auto; list-style-type:none;}
#mynav ul li{ float:left; margin:0px 5px; border-right:1px solid #fff;}
#mynav ul li a{ display:block; padding:0px 20px; height:40px; line-height:40px; color:#fff; text-shadow:0px -1px 0px rgba(30,30,30,0.60);}
</style>
</head>

Disclaimer

All resources on this site are contributed by netizens or reprinted by major download sites. Please check the integrity of the software yourself! All resources on this site are for learning reference only. Please do not use them for commercial purposes. Otherwise, you will be responsible for all consequences! If there is any infringement, please contact us to delete it. Contact information: admin@php.cn

Related Article

Encapsulated jquery page scrolling (sample code)_jquery Encapsulated jquery page scrolling (sample code)_jquery

16 May 2016

This article mainly introduces encapsulated jquery page scrolling. Friends who need it can come here for reference. I hope it will be helpful to everyone.

jQuery creates smooth page scrolling (top or bottom)_jquery jQuery creates smooth page scrolling (top or bottom)_jquery

16 May 2016

How to create a smooth scrolling effect is the purpose of this article. Using jQuery allows you to scroll to the top or bottom of your web page. It is a pretty good effect. If you are interested, don’t miss it.

jQuery web page right ad follows scrolling code sharing_jquery jQuery web page right ad follows scrolling code sharing_jquery

16 May 2016

This article mainly introduces two jQuery methods to implement scrolling advertising on the right side of the web page. Interested friends can refer to it.

Jquery web page WeChat QR code block scrolling effect specific implementation Jquery web page WeChat QR code block scrolling effect specific implementation

20 Jan 2017

I think everyone has seen the scrolling effect of WeChat QR code tiles on web pages. In the following article, we will introduce in detail how to implement it using Jquery. Interested friends can refer to it.

Jquery-like web page WeChat QR code block scrolling effect specific implementation_jquery Jquery-like web page WeChat QR code block scrolling effect specific implementation_jquery

16 May 2016

You must have seen the scrolling effect of WeChat QR code tiles on web pages. In the following article, we will introduce in detail how to implement it using Jquery. Interested friends can refer to it.

jQuery implements the fixed navigation effect code at the top of the web page_jquery jQuery implements the fixed navigation effect code at the top of the web page_jquery

16 May 2016

This article mainly introduces jQuery to implement the fixed navigation effect code at the top of the web page, and involves related techniques for jQuery to dynamically operate page element styles in response to scroll events. Friends in need can refer to the following

About the scrolling navigation bar code at the top of the blog_javascript skills About the scrolling navigation bar code at the top of the blog_javascript skills

16 May 2016

About the scroll navigation bar code at the top of the blog

How to use jQuery to return the page to the top (code attached) How to use jQuery to return the page to the top (code attached)

18 Oct 2018

Have you noticed when browsing the website that when you slide down the page, a return to the top button will appear. Click to return to the top. Do you know how to return to the top of an HTML page? This article will share with you the jQuery code that returns the simplest HTML page to the top. Interested friends can refer to it.

jQuery imitation 360 navigation page icon drag sorting effect code sharing_jquery jQuery imitation 360 navigation page icon drag sorting effect code sharing_jquery

16 May 2016

This article mainly introduces the 360 ​​navigation page icon drag sorting effect code. It is recommended to everyone. Friends in need can refer to it.

See all articles See all articles

Hot Tools

jQuery2019 Valentine's Day Confession Fireworks Animation Special Effects

jQuery2019 Valentine's Day Confession Fireworks Animation Special Effects

A very popular jQuery Valentine's Day confession fireworks animation special effect on Douyin, suitable for programmers and technical geeks to express their love to the girl they love. No matter you choose to be willing or not, you have to agree in the end.

layui responsive animated login interface template

layui responsive animated login interface template

layui responsive animated login interface template

520 Valentine's Day confession web animation special effects

520 Valentine's Day confession web animation special effects

jQuery Valentine's Day Confession Animation, 520 Confession Background Animation

Cool system login page

Cool system login page

Cool system login page

HTML5 tape music player-CASSETTE PLAYER

HTML5 tape music player-CASSETTE PLAYER

HTML5 tape music player-CASSETTE PLAYER

Hot Article

Luma Island: How To Get Tool Tokens
14 Nov 2024 Mobile Game Guide
Supervive: Hudson Build Guide
30 Nov 2024 Mobile Game Guide
Where to get a Psi Protection Suit in Stalker 2
28 Nov 2024 Mobile Game Guide