It seems that this special effect is very popular at present, and it has been published beforeJQuery Implement Sidebar Scroll with WindowHowever, some children's shoes found that the side bar would roll down against the footer after adding the JS special effect, so they would send a more perfect code:
<script type="text/javascript">
var documentHeight = 0;
var topPadding = 15;
$(function() {
var offset = $("#sidebar").offset();
documentHeight = $(document).height();
$(window).scroll(function() {
var sideBarHeight = $("#sidebar").height();
if ($(window).scrollTop() > offset.top) {
var newPosition = ($(window).scrollTop() - offset.top) + topPadding;
var maxPosition = documentHeight - (sideBarHeight + 368);
if (newPosition > maxPosition) {
newPosition = maxPosition;
}
$("#sidebar").stop().animate({
marginTop: newPosition
});
} else {
$("#sidebar").stop().animate({
marginTop: 0
});
};
});
});
</script>
Add the above javascript code to the theme header. php template.
Modify the“#sidebar”Side selector name for your theme;
Properly adjust the number according to the height of the header template of different themes“three hundred and sixty-eight”(The default number is HotNews topic).
Personally, I think that the side module is not very comfortable when the page is added with this special effect. It is suitable for the side bar with less content or the fixed module at the bottom of the side, such as advertisement scrolling.Each has his own love for turnips and vegetables. Let's continue to struggle.
Most of the articles on this site are original and used for personal learning records, which may be helpful to you, for reference only!
@Slight opening of eye curtainHehe, just now I was just testing. It's a perfect rolling effect I haven't had much spare time recently, so I don't have time to bother
@Advocate SproutingI use the method provided by you. However, it's OK to load image advertisements. When loading dynamic advertisements, they are always reloaded. I don't know what the problem is. Please give me some advice.
http://kailiwuang.net Please go and have a look. Why is the page opened by my video image tag always misplaced?? How to solve it?? What's more, after the title below is removed from the horizontal scroll of the home video, the height becomes smaller? thank you
Thank you, Brother Bird. But after using this new code, it still doesn't work. The bottom page is still bottomless. I also changed the number 368 to 0100200500900... Ps: The question function of wopus seems to be invalid..
Brother Bird, the most active readers on the sidebar are listed from top to bottom according to the number of comments, right? How can I change this to list by name and number?Now they are arranged by avatars.I looked for the sidebar and didn't see it.Thank you
Brother Bird, why can't my inside sidebar gadget be displayed.Drag several tools to all pages.Dead or alive is not displayed..
hellotwo Xiangtan City, Hunan Provincetwenty-oneF reply
How does wordpress add thumbnails to articles with custom columns?
Hello, Brother Bird, please ask me a question. I use Brother Bird's template. When the template is explained to thumbnails, there is such a sentence: "Add a custom column, call the specified picture, and recommend this method." I want to ask 1. How to add a user-defined column? 2. How to use this method?How can I call a picture?
The friends who know can also tell me, thank you!!
@RobinThe "Add custom columns, it seems that the control panel does not have this option, where is the background operation?"?
Lonely windone Nanshan District, Shenzhen City, Guangdong ProvinceBthree reply
@helloThere is a display option in the upper right corner of the background where you write articles. Click it, check the custom column, and it will be available under the editing area!
@Lonely windWhat is the value?For example, I want to specify that the article corresponds to a fixed image, and do not allow the image to be displayed immediately. How can I do this?thank you
hellotwo Xiangtan City, Hunan Provincetwenty-twoF reply
And where is the microblog and subscription of the small speaker at the bottom changed into its own?
@forty-five million four hundred and fifty-four thousand five hundred and forty-sixLet me ask you a question. I use the template of Brother Bird. When the template is explained to the thumbnail, there is such a sentence: "Add a custom column, call the specified picture, and recommend this method." I want to ask 1. How to add a user-defined column? 2. How to use this method?How can I call a picture? If you know something, you can also tell me, thank you!! When adding a custom column, what is the value?For example, I want to specify that the article corresponds to a fixed image, and do not allow the image to be displayed immediately. How can I do this?thank you
@Domestic oxygen generatorLet me ask you a question. I use the template of Brother Bird. When the template is explained to the thumbnail, there is such a sentence: "Add a custom column, call the specified picture, and recommend this method." I want to ask 1. How to add a user-defined column? 2. How to use this method?How can I call a picture? The friends who know can also tell me, thank you!! When adding a custom column, what is the value?For example, I want to specify that the article corresponds to a fixed image, and do not allow the image to be displayed immediately. How can I do this?thank you Submitted successfully, you can
Sanshuithree Tai'an City, Shandong Provincetwenty-nineF reply
ask a question Can you select only one link category to display the friendship links under the page?
@SanshuiYes, the link editing page adds nofollow in the "link network" relationship (rel)
Sanshuithree Tai'an City, Shandong ProvinceBfour reply
@RobinBrother, did you add rel="nofollow" to the "Remarks" below? Relationship (rel), can't write anything, can only choose, colleagues, friends, etc.You can't write rel="nofollow" directly
Brother Bird, my website ID is too many, and the webpage cannot be displayed [img]http://www.ttshare.com/wp-admin/themes.php?page=theme_options.php[/img]
Taigeone Zhuhai City, Guangdong Provinceforty-oneF reply
The blogger has time to change the picture on the home page to auto scroll.I studied all night, but I didn't respond to the change. I don't know where I made a mistake.
Hello, I used your theme,, Thank you so much.. This theme widget does not display the home page [img]http://uchqun.com/1.jpg[/img] [img]http://uchqun.com/2.jpg[/img]
The code is incomprehensible, but it can be copied and used.Thank you.
Jasonzero Ganzhou City, Jiangxi Provinceforty-sixF reply
If I want the bottom gadget on the right to follow the bottom of the page, instead of following the gadget on the top to the bottom.How to achieve?That is to say, sometimes the article is too long, and when it comes to the later part of the article, there will be no gadgets on the left, that is, the blank area. I want the bottom gadget on the left to follow, so there will be no blank area. How can I achieve this?
@JasonIt is impossible to just scroll the bottom widget, because you cannot select a widget DIV alone. The only way is to modify the template yourself, add a special fixed module on the side, and then select this module to scroll
Yes, I have. I'm going to make a blog for myself. Many people use this topic.
Space 9two Dongguan City, Guangdong Provinceforty-eightF reply
About this function, I have to spit out the slot today. I started to struggle after I published a long article in the afternoon. I didn't realize the following and scrolling until one o'clock in the morning. Generally, the js code is placed between and tags, but it can't be realized by putting it between and. At first, I thought that my right side was too long, so it was invalid, so I went online to find it,I tried several codes, but none.During the period, I found that many of them were copied directly from Brother Bird, even the words outside the code were identical.Later I saw your previous article "jQuery Implementation Sidebar Scroll with Window" 》On the 28th floor, I went to his station to see the reply. There was a sentence "Step 2: Add the following code to the top template:". I wondered if it was because my code was placed in front that it was invalid. I immediately changed Brother Bird's code to, uploaded and refreshed it. Oh yeah, it took me eight or nine hours to get it right, but one code was misplaced...Ah...But with this effect, reading is really dazzling.http://www.xptt.com/to-roll-up-your-sidebar.html/comment-page-1Brother Bird, like pulling out the popular tags and random articles separately on this page, and not following the scroll, but fixing them. How can we achieve this?The code released on this is also scrolled along the whole sidebar, which is different from the code used by him.I now use this on the website to test.Because our hotnews theme calls the backend widget set directly, how can we select the ID of one or several modules separately?I really can't think of a way out, so I have to consult you here.
@Dark BlueVery good!!!! (The sidebar of the 299 yuan advertisement) It is fixed first, and then appears when it is pulled down. How is the current sidebar implemented?
Populus euphraticazero Zhengzhou City, Henan Provinceseventy-oneF reply
This code will still scroll against the bottom. Can't you stop scrolling at a certain position?
