Ning Network Tips - Archived Tips

This Group contains archived Ning Tips. To add a new tip, please go here: Add Ning Tips & Tricks

To view new Ning Tips go here: Ning Tips & Tricks Forum.


VIP

Floating Quick Navigation

Give it a rest already! ...(Your pointer finger that is)...

I get tired of constantly scrolling and having to go to the top of the page to get to my tabs while working on my site. One of my favorite tips I got from Jensocial is for floating images. It's a great way to show content on every page (or use to get around). Be sure to read the original post on JS for more info.

 

Here's an example of the Floating Quick Navigation I made to zip around and give the old pointer finger a little break.

 

 

I made buttons to go to the top of the page, back a page, go to the home page, go to my profile page and go to the bottom of the page (along with an icon tray so the buttons have a common background. Remove it if you want). The codes are very simple so they play nice with others, but I'm sure you could use Jens' animated scroll and my image source if you wanted to. Though we are somewhat of a dysfunctional family sometimes, most are eager to help each other.....so here's a small contribution from me if you are interested:

 

  • Copy the attached text file.
  • Replace my URL with yours in the Hover Home Button and Hover Member Page ButtonMake sure you keep the /profiles for the member page.
  • Copy & paste your revised code into My Network / Tools / Custom Code (mine works fine on the top).

 

I made a few versions so you can pick something that works for you. If you want to change the icons or tray, click on the image you like, copy the URL and replace the image source in the existing code.

 

I have also attached a text file & button to "Go Forward" if you would rather use it in lieu of one of the other buttons.

 

If you use this tip, post a link to your site or a screenshot if it's a private network. I'd love to see how it looks on other themes! Enjoy!

 

Optional Images

 

Icon Trays:

 

 

Blue (#0d1962):

 

Dark Gray (#333333):

 

Pink (#be1176):

 

Red (#bf0000):


Load Previous Replies
  • up

    VIP

    Mind's Eye

    Thank you Fire-Tech.  I really like this Nav.  Two thumbs up.

    1
    • up

      VIP

      Mind's Eye

      There are a couple other things I would like to do with it one would be to change it to jquery *help* so I can put it in a js file and takes up less space that is one for sure.

      1
      • up

        Yio Capi

        Thank you, work it perfect! good job.

        3