DD Tab Menu Right Justified for Hebrew

**egurevich** · 10-29-2009, 04:21 PM

1) Script Title:
DD Tab Menu

2) Script URL (on DD):
http://www.dynamicdrive.com/dynamicindex1/ddtabmenu.htm

3) Describe problem:

I am using the DD Tab Menu script on a Hebrew webpage with glowtabs.css option. Hebrew text goes Right to Left. So I would like the menu also to display right to left. I changed the CSS file to Right Justify the menu on the page, but I still have 2 problems:

1) The line that continues away from the menu goes to the Right Side into infinity, so it completely disappears off the page. I want it to go to the left side, but I am not sure which code to modify.

2) I want the first tab to always be the default selected tab. The tabs in the UL list show up from left to right. I did a quick workaround of reversing them in the list and set the default tab to the last tab, however if someone later would add another tab then they would need to remember to change the number of the default tab. I would like that the tabs show up from Right to Left and not from Left to Right so that the default tab is always first. How can I do that?

Thanks

**Nile** · 10-29-2009, 09:00 PM

Please post a link to the page on your site that contains the problematic script so we can check it out.

Until then, I cannot help you.

By the way...
Be sure in your <html> tag at the top of the document looks like this:

HTML Code:

<html dir="rtl" lang="he" xml:lang="he" xlmns="http://www.w3.org/1999/xhtml">

For more information, visit http://www.w3.org/International/tutorials/bidi-xhtml/.

**egurevich** · 10-29-2009, 10:09 PM

Here is the link:
http://www.toseftaonline.org/levisudri/index.php

I added the tag at the top that you posted, but that just changed the default direction of paragraphs. It doesn't seem to effect which way the menu gets listed.

**Nile** · 10-30-2009, 03:05 PM

I currently see this:

Is this what you want to see?(I'm just making sure before I modify the code):

I don't understand you're #2 thing. Can you rephrase it?

**egurevich** · 10-31-2009, 04:23 PM

Yes for #1 that's exactly what I want to see.
For #2 it's the issue of coding. Currently the tab that's called ENGLISH in the HTML code as the first tab, because the script shows the tab that's first on the list on the left side. So it looks like this

...
ddtabmenu.definemenu("ddtabs2", 8) //initialize Tab Menu with LAST tab selected
...
<UL>
<LI>ENGLISH (the last tab on the left side)
<LI>...
<LI>...
<LI>...
<LI>...
<LI>...
<LI>...
<LI>HOME (the tab on the right side)
</UL>

What I would like is exactly the opposite. The code should look like this:

...
ddtabmenu.definemenu("ddtabs2", 0) //initialize Tab Menu with FIRST tab selected
...
<UL>
<LI>HOME (the tab on the right side)
<LI>...
<LI>...
<LI>...
<LI>...
<LI>...
<LI>...
<LI>ENGLISH (the last tab on the left side)
</UL>

The tabs should show up from RIGHT to LEFT as they do right now, but not because I reversed the order in the list, but because I set some flag in the code that makes that Tabs go from right to left.

Hope it's more clear now.

Thanks
Eli

**Nile** · 11-01-2009, 12:00 AM

When pasting a code, please remember to use [code] tags. That includes [ html ], [ code ], and [ php ].

And why don't you just do:

Code:

<UL>
<LI>HOME (the tab on the right side)
<LI>...
<LI>...
<LI>...
<LI>...
<LI>...
<LI>...
<LI>ENGLISH (the last tab on the left side)
</UL>

Is it not working like that?

**egurevich** · 11-01-2009, 07:36 AM

It does not work like that. It reverses the order of the tabs.

**Nile** · 11-01-2009, 01:56 PM

Change glowtabs-hebrew.css to:

Code:

<html lang="he" xlmns="http://www.w3.org/1999/xhtml" xml:lang="he" dir="rtl">
<head>
</head>
<body background="images/background.gif">
</body>
</html>
 
.glowingtabs {
border-bottom:1px solid #7E9FFF;
float:right;
line-height:normal;
width:100%;
}
.glowingtabs ul {
list-style-type:none;
margin:0 5px 0 0;
padding:0;
}
.glowingtabs li {
display:inline;
margin:0;
padding:0;
float:right;
}
.glowingtabs a {
background:transparent url(media/glowtab-left.gif) no-repeat scroll left top;
float:left;
margin:0 5px 0 0;
padding:0 0 0 9px;
text-decoration:none;
}
.glowingtabs a span {
background:transparent url(media/glowtab.gif) no-repeat scroll right top;
color:#3B3B3B;
display:block;
float:left;
font-weight:bold;
padding:5px 12px 3px 3px;
}
.glowingtabs a span {
float:none;
}
.glowingtabs a:hover span {
color:black;
}
.glowingtabs a.current {
background-position:0 -82px;
}
.glowingtabs a.current span {
background-position:100% -82px;
color:black;
}
.glowingtabs a:hover {
background-position:0 -82px;
}
.glowingtabs a:hover span {
background-position:100% -82px;
}
.tabcontainer {
clear:left;
height:1.5em;
width:95%;
}
.tabcontent {
display:none;
}

**egurevich** · 11-01-2009, 08:34 PM

this solved problem #2. The tabs now reversed order. But problem #1 got worse. Now the line completely disappeared. Take a look at the link:

http://www.toseftaonline.org/levisudri/index.php

**egurevich** · 11-01-2009, 08:45 PM

I figured out the problem. The code in the beginning was causing the line to disappear.
I removed this:

Code:

<html lang="he" xlmns="http://www.w3.org/1999/xhtml" xml:lang="he" dir="rtl">
<head>
</head>
<body background="images/background.gif">
</body>
</html>

and now it works correctly.
Thanks

Thread: DD Tab Menu Right Justified for Hebrew

Thread Tools

Search Thread

DD Tab Menu Right Justified for Hebrew

Bookmarks

Bookmarks

Posting Permissions