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.

Tabbed Homepage Message

View previous topic View next topic Go down

Solved Tabbed Homepage Message

Post by rblatch on May 9th 2010, 4:02 pm

How can I get a tabbed homepage message?

Thanks
Rob Cool

rblatch
Active Poster

Male Posts : 1042
Reputation : 2
Language : HTML & CSS (Learning)
Location : Graphics Central

Back to top Go down

Solved Re: Tabbed Homepage Message

Post by kirk on May 9th 2010, 6:27 pm

what do you mean by tabbed.. a tab in your navbar leading to a message or something?

kirk
Forumaster

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

Back to top Go down

Solved Re: Tabbed Homepage Message

Post by rblatch on May 9th 2010, 6:33 pm


rblatch
Active Poster

Male Posts : 1042
Reputation : 2
Language : HTML & CSS (Learning)
Location : Graphics Central

Back to top Go down

Solved Re: Tabbed Homepage Message

Post by kirk on May 9th 2010, 6:41 pm

do you have a code for it?

kirk
Forumaster

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

Back to top Go down

Solved Re: Tabbed Homepage Message

Post by rblatch on May 9th 2010, 9:56 pm

No, lol.

Thats what i'm asking thumright

rblatch
Active Poster

Male Posts : 1042
Reputation : 2
Language : HTML & CSS (Learning)
Location : Graphics Central

Back to top Go down

Solved Re: Tabbed Homepage Message

Post by MrMario on May 10th 2010, 5:30 am

I found this: http://stilbuero.de/jquery/tabs_3/

http://jquery.com/ is site you qill need to get started with it.

MrMario
Helper
Helper

Male Posts : 22186
Reputation : 1830
Language : test

http://test.com

Back to top Go down

Solved Re: Tabbed Homepage Message

Post by Codyy on May 10th 2010, 6:07 am

Heyyy, thats from CFS!

I coded that box my self.

It is consisted of CSS & HTML.

I wouldn't suggest taking it from CFS, as you can get several federal charges pressed against you by the DMCA.

Codyy
Active Poster

Male Posts : 1030
Reputation : 16
Language : English
Location : F L o R i D A

http://forumansion.net

Back to top Go down

Solved Re: Tabbed Homepage Message

Post by liufang898186 on May 10th 2010, 7:51 am

I actually really enjoy reading your blog. Glad you’re sticking around! And I must say, I absolutely love the title of your blog .

liufang898186
New Member

Posts : 4
Reputation : 0
Language : chinese

Back to top Go down

Solved Re: Tabbed Homepage Message

Post by rblatch on May 10th 2010, 11:44 am

CodyCFS wrote:Heyyy, thats from CFS!

I coded that box my self.

It is consisted of CSS & HTML.

I wouldn't suggest taking it from CFS, as you can get several federal charges pressed against you by the DMCA.

I'm not ripping it am I? You can't stop anyone from usin a diffrent version of it Wink

I also know the law Smile

rblatch
Active Poster

Male Posts : 1042
Reputation : 2
Language : HTML & CSS (Learning)
Location : Graphics Central

Back to top Go down

Solved Re: Tabbed Homepage Message

Post by rblatch on May 11th 2010, 6:58 pm

Bump ?

rblatch
Active Poster

Male Posts : 1042
Reputation : 2
Language : HTML & CSS (Learning)
Location : Graphics Central

Back to top Go down

Solved Re: Tabbed Homepage Message

Post by rblatch on May 13th 2010, 8:57 pm

Bump

rblatch
Active Poster

Male Posts : 1042
Reputation : 2
Language : HTML & CSS (Learning)
Location : Graphics Central

Back to top Go down

Solved Re: Tabbed Homepage Message

Post by harvengure on May 20th 2010, 6:46 pm

While I've had to cheat to make it work in posts, I know from personal experience that this works.

It may take some playing around with but should you have any troubles I'll keep an eye on this thread and help you getting it right.

harvengure
Forumember

Posts : 86
Reputation : 0
Language : English

Back to top Go down

Solved Re: Tabbed Homepage Message

Post by crysis992 on May 20th 2010, 7:43 pm

Could you explain me exatcly how to do that? Or post an example code for an html page,
because for some reason it wont work for me,not in templates not in a html page.

Here I tried it at my testforum: http://crysis992.forumieren.de/Test-h18.htm

,
crysis992

crysis992
Forumember

Posts : 67
Reputation : 0
Language : German

Back to top Go down

Solved Re: Tabbed Homepage Message

Post by harvengure on May 21st 2010, 5:56 am

Ah. You made a very common mistake for beginners, not that I am much more then a beginner myself. You did not link the jQuery library. Also you are missing a "});" from your code to close off the easytabs snippet.

It's not as pretty or inclusive as it could be if best practices but the following code should work for you.
Code:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<!--*/ jQuery Library /*-->
<script src="http://code.jquery.com/jquery-latest.js" type="text/javascript"></script>
<!--*/ EasyTabs Library /*-->
<script src="http://www.alfajango.com/javascripts/jquery.easytabs.js" type="text/javascript"></script>
<!--*/ Function that calls EasyTabs /*-->
<script  type="text/javascript">
  $(document).ready(function(){ $('#tab-container').easyTabs();
});
</script>
<!--*/ Start of CSS /*-->
<style type="text/css">
#tab-container ul { margin:  0; padding: 0;  }
#tab-container ul li { display: inline-block; background: #ccc; border: solid 1px; border-bottom: none; }
#tab-container ul li a { display: block; padding: 5px; outline: none; }
#tab-container ul li a:hover { text-decoration: underline; }
#tab-container ul li.active { background: #fff; padding-top: 6px; position: relative; top: 1px; }
#tab-container ul li a.active { font-weight: bold; }
#tab-container .panel-container { border: solid 1px; padding: 0 10px; }
</style>
<!--*/ End of CSS /*-->
</head>
<body>
<div id="tab-container">
  <ul>
    <li><a href="#tab-1-div">Tab 1</a></li>

    <li><a href="#that-other-tab">The Second Tab</a></li>
    <li><a href="#lastly">Tab C</a></li>
  </ul>
  <div id="tab-1-div">
    <h2>Heading 1</h2>
    <p>This is the content of the first tab.</p>
  </div>
    <div id="that-other-tab">
    <h2>Heading 2</h2>
    <p>Stuff from the second tab.</p>
  </div>
  <div id="lastly">
    <h2>Heading 3</h2>
    <p>More stuff from the last tab.</p>
  </div>
</div>
</body>
</html>

harvengure
Forumember

Posts : 86
Reputation : 0
Language : English

Back to top Go down

Solved Re: Tabbed Homepage Message

Post by crysis992 on May 21st 2010, 1:03 pm

Oh thank you very much Smile

crysis992
Forumember

Posts : 67
Reputation : 0
Language : German

Back to top Go down

Solved Re: Tabbed Homepage Message

Post by harvengure on June 8th 2010, 9:29 am

I think this is resolved. Crysis?

harvengure
Forumember

Posts : 86
Reputation : 0
Language : English

Back to top Go down

Solved Re: Tabbed Homepage Message

Post by Something Clever on August 2nd 2010, 10:23 am

How did you get that collapsed menu on the side on your test forum? That's from jQuery, right? I've been trying to figure it out, but I don't know how.

Something Clever
Forumember

Posts : 37
Reputation : 0
Language : English

Back to top Go down

Solved Re: Tabbed Homepage Message

Post by RoNo on August 2nd 2010, 1:12 pm

That's a version of the jQuery OS X Style Dock
and Stack Navigation
called the "Share Stack".

The original thread about it is here but I'll save you some
time on it since I still have the stacker script hosted.
You'll need to edit the links & pics at the bottom.
Code:
<style type="text/css">
.stack { position: fixed; bottom: 5px; right: 25px; font: 13px "Trebuchet MS", Verdana, Helvetica, sans-serif; color: #666; }
.stack * { margin: 0; padding: 0; }
.stack > img { position: relative; cursor: pointer; padding-top: 35px; z-index: 2; }
.stack ul { list-style: none; position: absolute; top: 5px; margin:0; cursor: pointer; z-index: 1; }
.stack ul li { position: absolute; }
.stack ul li img { border: 0; }
.stack ul li span { display: none; }
.stack .openStack li span {
  display: block;
  position: absolute;
  top: 17px;
  right: 60px;
  height: 14px; 
  line-height: 14px;
  background-color:#000;
  border: 0; 
  padding: 3px 10px; 
  text-align: center;
  text-shadow: #000 1px 1px 1px;
  font-family: "Lucida Grande", Lucida, Verdana, sans-serif;
  font-size: 12px;
  color: #fcfcfc; 
  border-radius: 10px; 
  opacity: .85;
  filter: alpha(opacity = 85);
  -webkit-border-radius: 10px;
  -moz-border-radius: 10px;
}

/* IE Fixes */
.stack { _position: absolute; }
.stack ul { _z-index:-1; _top:-15px; }
.stack ul li {*right:5px;}
.stack a {text-decoration:none}
</style><div class="stack">
    <img src="http://www.addthis.com/cms-content/images/gallery/stack.png" alt="stack"/>
    <ul id="stack">

<li><a href="Link5.com"><span>Link5</span><img src="http://www.addthis.com/cms-content/images/gallery/facebook.png" alt="Link5" /></a></li>
     
<li><a href="Link4.com"><span>Link4</span><img src="http://www.addthis.com/cms-content/images/gallery/stumbleupon.png" alt="Link4" /></a></li>
     
<li><a href="Link3.com"><span>Link3</span><img src="http://www.addthis.com/cms-content/images/gallery/reddit.png" alt="Link3" /></a></li>
     
<li><a href="Link2.com"><span>Link2</span><img src="http://www.addthis.com/cms-content/images/gallery/digg.png" alt="Link2" /></a></li>
     
<li><a href="Link1.com"><span>Link1</span><img src="http://www.addthis.com/cms-content/images/gallery/addthis.png" alt="Link1" /></a></li>
    </ul>
</div> 

<script type="text/javascript" src="http://code.jquery.com/jquery-1.4.2.min.js"></script>

<script type="text/javascript" src="http://www.yourjavascript.com/134446808/stack1.js"></script>
This will work as a widget (no table type) or in the Homepage Message.
Admin Panel»Display»Homepage»Generalities»Message Content. Demo


Since the original issue's been resolved, this is closed.
Open a new topic if you need help with the Share Stack.
RoNo
General rules
Tricks & Tips
FAQ listing
For founders who lost their passwords
About support requests by PM
Announcements & Updates

RoNo
Active Poster

Male Posts : 1270
Reputation : 135
Language : English
Location : Laguna Beach, California

http://bf2mercenaries.forumotion.com/

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