The forum of the forums
Welcome to the Official Support Forum of Forumotion!

To take full advantage of everything offered by our forum, please log in if you are already a member, or join our community if you've not yet.



Create a free forum like this one.

Sliding Info Menu

View previous topic View next topic Go down

In progress Sliding Info Menu

Post by Yoshi156 on May 7th 2013, 7:40 am

You seen the sliding menu on the left side? that's what I mean, I wonder if any staff know how to make like that? kindly teach me how? thanks!

http://reikai.forumotion.com/forum

Yoshi156
Forumember

Male Posts : 231
Reputation : 0
Language : english

Back to top Go down

In progress Re: Sliding Info Menu

Post by Derri on May 7th 2013, 12:05 pm

What sliding menu?



Forum Rules: :Forumotion Staff: :Appeal A Warning: :FAQ: :Tips & Tricks: :Forgotten Password/Login Issues
You need one post to send a PM
When your topic has been solved, ensure you mark the topic solved
Never post your email in public


Derri
Administrator
Administrator

Male Posts : 8355
Reputation : 571
Language : English & Basic French
Location : Scotland, United Kingdom

Back to top Go down

In progress Re: Sliding Info Menu

Post by Jezzda on May 7th 2013, 12:09 pm

Top left, next to the banner. I'd like to know how to create this as well.

Jezzda
Forumember

Posts : 74
Reputation : 2
Language : English

Back to top Go down

In progress Re: Sliding Info Menu

Post by Jezzda on May 8th 2013, 11:16 am

Bump.

Jezzda
Forumember

Posts : 74
Reputation : 2
Language : English

Back to top Go down

In progress Re: Sliding Info Menu

Post by BetterHax on May 8th 2013, 3:48 pm

@Jezzda wrote:Bump.

dont bump other thread..

BetterHax
Forumember

Posts : 304
Reputation : 3
Language : English,Tagalog
Location : United State, Philippines

Back to top Go down

In progress Re: Sliding Info Menu

Post by Jophy on May 8th 2013, 5:47 pm


Jophy
ForumGuru

Male Posts : 17924
Reputation : 835
Language : English
Location : Somewhere

Back to top Go down

In progress Re: Sliding Info Menu

Post by Jezzda on May 8th 2013, 11:12 pm

@BetterHax wrote:
@Jezzda wrote:Bump.

dont bump other thread..

I'm fairly sure I can bump other threads if I need an answer as well. Otherwise the thread will be forgotten.

Jophy - That link didn't help, it wouldn't work.

Jezzda
Forumember

Posts : 74
Reputation : 2
Language : English

Back to top Go down

In progress Re: Sliding Info Menu

Post by kirk on May 9th 2013, 5:15 am

@BetterHax wrote:
@Jezzda wrote:Bump.

dont bump other thread..

Please do not moderate others.
Members can reply/bump their own threads as long as the reply is separated by at least 24 hours Smile

kirk
Forumaster

Male Posts : 11037
Reputation : 651
Language : English,Vulcan,Klingon, Romulan,& Gorn

Back to top Go down

In progress Re: Sliding Info Menu

Post by Jezzda on May 9th 2013, 11:03 pm

So is anybody able to help me with my issue?

Jezzda
Forumember

Posts : 74
Reputation : 2
Language : English

Back to top Go down

In progress Re: Sliding Info Menu

Post by Jezzda on May 15th 2013, 6:03 am

Bump

Jezzda
Forumember

Posts : 74
Reputation : 2
Language : English

Back to top Go down

In progress Re: Sliding Info Menu

Post by Jophy on May 15th 2013, 6:40 am


Jophy
ForumGuru

Male Posts : 17924
Reputation : 835
Language : English
Location : Somewhere

Back to top Go down

In progress Re: Sliding Info Menu

Post by Jezzda on May 15th 2013, 2:43 pm

I don't want a slider. I just want an info menu that slides out of the side when I hover over it and I'd like to fill it with information about my site.

Jezzda
Forumember

Posts : 74
Reputation : 2
Language : English

Back to top Go down

In progress Re: Sliding Info Menu

Post by Mati on May 15th 2013, 3:27 pm

@Jezzda wrote:I don't want a slider. I just want an info menu that slides out of the side when I hover over it and I'd like to fill it with information about my site.

Just give me a mins I'll wright the code for you. Wink

Mati
Active Poster

Posts : 1873
Reputation : 281
Language : || HTML || CSS || jQuery ||
Location : At the Gym

http://elite-gaming.forumotion.net/

Back to top Go down

In progress Re: Sliding Info Menu

Post by Sir Chivas™ on May 15th 2013, 3:45 pm

Hi,

You can do something like this, but instead of placing the image and URL code, place the text or whatever you want. Wink
http://www.csshelp.net/t365-add-floating-social-icons-on-your-forum



Attention!
- Please provide your forum URL at all times.
- When the issue is solved, please mark it as solved.



Sir Chivas™
Support Moderator
Support Moderator

Male Posts : 6756
Reputation : 428
Language : English, Spanish, and French
Location : || CSS || HTML || Graphics Designs || Support ||

Back to top Go down

In progress Re: Sliding Info Menu

Post by Mati on May 15th 2013, 10:39 pm

Put this CSS code into your CSS.

Code:
.slide-main {
    left: 0;
    position: fixed;
    top: 20%;
    transition-duration: 1s;
}
#menu a {
    text-decoration: none;
}
#menu ul li {
    padding: 3px 25px;
}
.slide-container {
    background: none repeat scroll 0 0 #DCDCDC;
    border: 2px solid #444444;
    border-radius: 5px 5px 5px 5px;
    left: -140px;
    position: fixed;
    top: 20%;
    transition-duration: 1s;
}
.slide-main:hover {
    left: 145px;
}
.slide-main:hover .slide-container {
    left: 5px;
}

Then add this into your Homepage Message.

Code:
<div class="slide-main">
  <img src="http://cdn5.iconfinder.com/data/icons/Absolute%2032-PNG/32/Warning.png" />
  <div class="slide-container">
  <div id="menu">
        <ul>
            <li><a href="#">Menu Item 1</a></li>
            <li><a href="#">Menu Item 2</a></li>
            <li><a href="#">Menu Item 3</a></li>
            <li><a href="#">Menu Item 4</a></li>
            <li><a href="#">Menu Item 5</a></li>
            <li><a href="#">Menu Item 6</a></li>
            <li><a href="#">Menu Item 7</a></li>
            <li><a href="#">Menu Item 8</a></li>
            <li><a href="#">Menu Item 9</a></li>
            <li><a href="#">Menu Item 10</a></li>
        </ul>
    </div>
  </div>
</div>

Mati
Active Poster

Posts : 1873
Reputation : 281
Language : || HTML || CSS || jQuery ||
Location : At the Gym

http://elite-gaming.forumotion.net/

Back to top Go down

In progress Re: Sliding Info Menu

Post by Jezzda on May 17th 2013, 12:53 pm

Thanks! I'd like to know if there is anywhere you know of that I can find good pictures for it.. like the website provided by the topic starter and also how to make it be on every page.

Jezzda
Forumember

Posts : 74
Reputation : 2
Language : English

Back to top Go down

In progress Re: Sliding Info Menu

Post by Jezzda on May 18th 2013, 2:33 pm

Bump

Jezzda
Forumember

Posts : 74
Reputation : 2
Language : English

Back to top Go down

In progress Re: Sliding Info Menu

Post by Mati on May 18th 2013, 4:43 pm

@Jezzda wrote:Thanks! I'd like to know if there is anywhere you know of that I can find good pictures for it.. like the website provided by the topic starter and also how to make it be on every page.

Do you have your own images.

Mati
Active Poster

Posts : 1873
Reputation : 281
Language : || HTML || CSS || jQuery ||
Location : At the Gym

http://elite-gaming.forumotion.net/

Back to top Go down

In progress Re: Sliding Info Menu

Post by Jezzda on May 18th 2013, 6:59 pm

No, that's why I'm asking. How do I have it on every page?

Jezzda
Forumember

Posts : 74
Reputation : 2
Language : English

Back to top Go down

In progress Re: Sliding Info Menu

Post by Jezzda on May 19th 2013, 9:24 pm

Bump

Jezzda
Forumember

Posts : 74
Reputation : 2
Language : English

Back to top Go down

In progress Re: Sliding Info Menu

Post by Mati on May 19th 2013, 10:20 pm

@Jezzda wrote:No, that's why I'm asking. How do I have it on every page?

Put it in your templates overall_header

Mati
Active Poster

Posts : 1873
Reputation : 281
Language : || HTML || CSS || jQuery ||
Location : At the Gym

http://elite-gaming.forumotion.net/

Back to top Go down

In progress Re: Sliding Info Menu

Post by Jezzda on May 20th 2013, 11:08 am

Could you give me a screenshot of where that is?

Jezzda
Forumember

Posts : 74
Reputation : 2
Language : English

Back to top Go down

In progress Re: Sliding Info Menu

Post by Mati on May 20th 2013, 12:05 pm

@Jezzda wrote:Could you give me a screenshot of where that is?

Find this
Code:
<!-- END switch_login_popup -->
and put the code below that.

Mati
Active Poster

Posts : 1873
Reputation : 281
Language : || HTML || CSS || jQuery ||
Location : At the Gym

http://elite-gaming.forumotion.net/

Back to top Go down

In progress Re: Sliding Info Menu

Post by kirk on May 20th 2013, 7:28 pm

Matti_7 wrote:
@Jezzda wrote:Could you give me a screenshot of where that is?

Find this
Code:
<!-- END switch_login_popup -->
and put the code below that.

go to admin panel> display> templates> general> overall_header template.

Find the part Matti_7 has said above, you can do a search at the top of the template as well.
Then add the second part of the code and hit save. now go back and publish it by clicking the plus icon Add and your done Smile

kirk
Forumaster

Male Posts : 11037
Reputation : 651
Language : English,Vulcan,Klingon, Romulan,& Gorn

Back to top Go down

View previous topic View next topic Back to top


 
Permissions in this forum:
You cannot reply to topics in this forum