HTA Tabs

Forums

My Profile

Inbox

Address Book

My Subscription

My Forums

HTA Tabs

Logged in as: Guest

arrSession:exec spGetSession 2,2,65260

	Active Users: There are 0 members and 0 guests.
	Users viewing this topic: none

Printable Version

All Forums >> [Scripting] >> WSH & Client Side VBScript >> HTA Tabs
Do you like VisualBasicScript.com? Link to us and help spread the word about our forum. Thanks!

Page: [1]

Message

<< Older Topic Newer Topic >>

HTA Tabs - 10/19/2008 11:13:53 PM

morpheus83uk

Posts: 435
Score: 0
Joined: 8/21/2006
Status: offline

Hello,

I am looking at a way of using tabs in HTA to switch between pages.

I have hunted around and I know it can be done but I have no idea how or where to start. I have a page ready for one of the tabs but the example I have is not big enough nor does it work. If I click on a tab it just gives me an error saying that "Object Expected" the Line is either 88,89,90,91 or 92 depending on which Tab you click on.

As this is an example and I am new to HTA I have no real cue about what I am doing... I have modified it slightly but without some assistance I have no idea what I am properly doing.

Please could someone provide me some assistance or give me an idea about whats going wrong? If there is a much better way of doing this with images and making it a bit more user friendly and flashy if you like I would like to know how to do this :)

I have no problems learning I just need help as to where to go etc.

The Example Code I have is:

<html>
<head>
<title>Tabs</title>
<HTA:Application
ID = "HTA"
ApplicationName = "Tabs"
Border = "Thin"
BorderStyle = "Normal"
Caption = "Yes"
ContextMenu="Yes"
Icon = ""
InnerBorder="No"
MaximizeButton = "Yes"
MinimizeButton = "Yes"
Navigable="Yes"
Scroll="Yes"
SrollFlat="No"
Selection="Yes"
ShowInTaskBar = "Yes"
SingleInstance = "Yes"
SysMenu = "Yes"
Version = "1.0" 
WindowState = "Maximize"
<script type="text/javascript">
self.moveTo(0,0);
self.resizeTo(800,600);
var Panels = new Array("","Panel1","Panel2","Panel3","Panel4","pane l5");
function Panel(tab) {
for (i=1; i<Panels.length; i++) {
if (i == tab) {
document.getElementById("tab"+i).className = "Tabs Tabs1";
document.getElementById("Panel"+i).style.display = "block";
} else {
document.getElementById("tab"+i).className = "Tabs Tabs0";
document.getElementById("Panel"+i).style.display = "none";
} } }
</script>
<style type="text/css">
body,td,th { font-family:Arial }
..head { font-size:110%; font-weight:bold }
..Panel {
background-color: white;
border: solid 1px black;
height: 410px;
padding: 5px;
position: relative;
width: 650px;
z-index: 0;
}
..Tabs {
border-collapse: collapse;
color: black;
cursor: pointer;
cursor: hand;
font-family: arial;
font-size: 9pt;
font-weight: bold;
margin-top: 4px;
padding: 2px 4px 0px 4px;
position: relative;
text-align: center;
text-decoration: none;
z-index: 1;
}
..Tabs0 {
background-color: wheat;
border: solid 1px black;
}
..Tabs1 {
background-color: white;
border-color: black black white black;
border-style: solid solid solid solid;
border-width: 1px 1px 1px 1px; }
</style>
</head>
<body>
<table align="center" border="0" cellpadding="0" cellspacing="0"
width="650">
<tr valign="top">
<td align="right" colspan="2">
<span class="head">Tabs</span> &nbsp; &nbsp;
<br>
</td>
</tr>
<tr valign="top">
<td colspan="2">
<span class="Tabs Tabs1" id="Tab1" onclick="Panel(1)">Call Logging</span>&nbsp; 
<span class="Tabs Tabs0" id="Tab2" onclick="Panel(2)">Maintenance</span>&nbsp; 
<span class="Tabs Tabs0" id="Tab3" onclick="Panel(3)">Software Install</span>&nbsp; 
<span class="Tabs Tabs0" id="Tab4" onclick="Panel(4)">Contact No's</span>&nbsp; 
<span class="Tabs Tabs0" id="Tab5" onclick="Panel(5)">Spare Tab</span>
<div class="Panel" id="Panel1" style="display:block">
<hr color="black">
<table border="0" width="100%">
<tr valign="top">
<td>
<span class="head">This Is The Call Logging Tab.</span>
<br><br>
Log Your Service Desk Calls Here
</td>
</tr>
</table>
</div>
<div class="Panel" id="Panel2" style="display:none">
<hr color="black">
<table border="0" width="100%">
<tr valign="top">
<td>
<span class="head">This Is The Maintenance Tab</span>
<br><br>
Maintenance Options Are Here To Speed Up Your PC.
</td>
</tr>
</table>
</div>
<div class="Panel" id="Panel3" style="display:none">
<hr color="black">
<table border="0" width="100%">
<tr valign="top">
<td>
<span class="head">This Is The Software Installation Tab.</span>
<br><br>
Install Standard Software Here All By Yourself
</td>
</tr>
</table>
</div>
<div class="Panel" id="Panel4" style="display:none">
<hr color="black">
<table border="0" width="100%">
<tr valign="top">
<td>
<span class="head">This Is The Contat Info Tab.</span>
<br><br>
Contact Information Here: <br> Service Desk 5432
</tr>
</table>
</div>
<div class="Panel" id="Panel5" style="display:none">
<hr color="black">
<table border="0" width="100%">
<tr valign="top">
<td>
<span class="head">This Is A Spare Tab</span>
<br><br>
Content For Spare Tab Goes Here
</td>
</tr>
</table>
</div>
</td>
</tr>
</table>
</body>
</html>

Many Thanks

James

_____________________________

VBScript Documentation:

http://www.microsoft.com/downloads/details.aspx?FamilyID=01592c48-207d-4be1-8a76-1c4099d7bbb9&displaylang=en

Post #: 1

RE: HTA Tabs - 10/20/2008 2:47:43 AM

TNO

Posts: 1402
Score: 16
Joined: 12/18/2004
From: thenewobjective.com
Status: offline

I didn't stylize everything, but here's a cleaner version of what you want I think:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
   <head>
   <title>Tabs</title>
       <hta:application 
        ID = "HTA" 
        ApplicationName = "Tabs"
        Border = "Thin"
        InnerBorder="No"
        Navigable="Yes"
        SrollFlat="No"
        SingleInstance = "Yes"
        Version = "1.0"
        WindowState = "Maximize" />
        
       <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

_____________________________

To iterate is human, to recurse divine. -- L. Peter Deutsch

(in reply to morpheus83uk)

Post #: 2

RE: HTA Tabs - 10/21/2008 12:52:57 AM

morpheus83uk

Posts: 435
Score: 0
Joined: 8/21/2006
Status: offline

Hello,

Thanks for that I have put something together with that code you have given me which works great :) thanks for that :)

what sort of stuff would I need to make it more styled?

Just some guidelines etc would be fine I can have a play from there :)

Many Thanks

James

_____________________________

VBScript Documentation:

http://www.microsoft.com/downloads/details.aspx?FamilyID=01592c48-207d-4be1-8a76-1c4099d7bbb9&displaylang=en

(in reply to TNO)

Post #: 3

RE: HTA Tabs - 10/22/2008 12:37:20 AM

TNO

Posts: 1402
Score: 16
Joined: 12/18/2004
From: thenewobjective.com
Status: offline

hmm, I think the question is too vague, its like asking "how should I paint a picture?". What do you ultimately want to accomplish with the look?

_____________________________

To iterate is human, to recurse divine. -- L. Peter Deutsch

(in reply to morpheus83uk)

Post #: 4

RE: HTA Tabs - 10/22/2008 1:55:06 AM

morpheus83uk

Posts: 435
Score: 0
Joined: 8/21/2006
Status: offline

Maybe something by using pictures of something or possibly just making the over all look a little more jazzy.

Possibly more picture form for now.

Does this help?

Many Thanks

James

_____________________________

VBScript Documentation:

http://www.microsoft.com/downloads/details.aspx?FamilyID=01592c48-207d-4be1-8a76-1c4099d7bbb9&displaylang=en

(in reply to TNO)

Post #: 5

RE: HTA Tabs - 10/22/2008 2:36:20 AM

TNO

Posts: 1402
Score: 16
Joined: 12/18/2004
From: thenewobjective.com
Status: offline

http://www.alistapart.com/articles/slidingdoors/
http://www.alistapart.com/articles/slidingdoors2/

_____________________________

To iterate is human, to recurse divine. -- L. Peter Deutsch

(in reply to morpheus83uk)

Post #: 6

RE: HTA Tabs - 10/22/2008 11:09:23 PM

mbouchard

Posts: 1924
Score: 16
Joined: 5/15/2003
From: USA
Status: offline

quote:

ORIGINAL: TNO

hmm, I think the question is too vague, its like asking "how should I paint a picture?". What do you ultimately want to accomplish with the look?

Now that is an easy question, just point them here.

_____________________________

Mike

For useful Scripting links see the Read Me First stickey!

Always remember Search is your friend.

(in reply to TNO)

Post #: 7

RE: HTA Tabs - 10/24/2008 7:30:35 AM

Fredledingue

Posts: 383
Score: 0
Joined: 5/9/2005
From:
Status: offline

quote:

Maybe something by using pictures of something or possibly just making the over all look a little more jazzy.

Use a picture instead of text in your links on the tabs.

-------

TNO, others,

Will code in an iframe interact with the main page scripts?

_____________________________

Fred

(in reply to morpheus83uk)

Post #: 8

RE: HTA Tabs - 10/25/2008 5:38:19 AM

TNO

Posts: 1402
Score: 16
Joined: 12/18/2004
From: thenewobjective.com
Status: offline

quote:

TNO, others,

Will code in an iframe interact with the main page scripts?

if you're in an HTA and you set the application attribute on the frame to yes it will otherwise only the top level code can access the frame and not vice versa.

If you;re in a regular html page they have to be in the same domain for them to interact

_____________________________

To iterate is human, to recurse divine. -- L. Peter Deutsch

(in reply to Fredledingue)

Post #: 9

RE: HTA Tabs - 10/25/2008 7:00:17 AM

Fredledingue

Posts: 383
Score: 0
Joined: 5/9/2005
From:
Status: offline

hanks TNO.

So I understand that this method is not fit for an interractive hta where there are buttons on the so-called tab (frames) to access codes on the main page. But these codes would work if written within the frame source. Right?

_____________________________

Fred

(in reply to TNO)

Post #: 10

RE: HTA Tabs - 10/25/2008 12:29:38 PM

TNO

Posts: 1402
Score: 16
Joined: 12/18/2004
From: thenewobjective.com
Status: offline

http://msdn.microsoft.com/en-us/library/ms536496(VS.85).aspx#Security

_____________________________

To iterate is human, to recurse divine. -- L. Peter Deutsch

(in reply to Fredledingue)

Post #: 11

RE: HTA Tabs - 10/27/2008 4:35:37 AM

Fredledingue

Posts: 383
Score: 0
Joined: 5/9/2005
From:
Status: offline

Thanks

_____________________________

Fred

(in reply to TNO)

Post #: 12

RE: HTA Tabs - 10/28/2008 7:21:15 AM

morpheus83uk

Posts: 435
Score: 0
Joined: 8/21/2006
Status: offline

Hello,

In response to Fred saying just use an image...

I have tried this but I have been unsuccessful.

My code is:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "[link=http://www.w3.org/TR/html4/strict.dtd]http://www.w3.org/TR/html4/strict.dtd[/link]">
<html>
  <head>
  <title>Tabs</title>
      <hta:application 
       ID = "HTA" 
       ApplicationName = "Tabs"
       Border = "Thin"
       InnerBorder="No"
       Navigable="Yes"
       SrollFlat="No"
       SingleInstance = "Yes"
       Version = "1.0"
       WindowState = "Maximize" />
       
      <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
      <base target="content"/>
      <style type="text/css">
          #content{
              width:640px;
              height:480px;
          }
          div{
              width:640px;
          }
          a{
              font:9pt Arial Bold;
              color:black;
              background-image:url('test.jpg')
              text-align:center;
              border:1px solid black;
              text-decoration:none;
          }
      </style>
      
      <style type="text/css">
body 
{
</style>
      <script type="text/javascript">
          self.moveTo(0,0);
          self.resizeTo(800,600);
      </script>
  </head>
  <body>
      <div>
          <a href="[link=http://www.google.com]http://www.google.com[/link]" style="background:test.JPG"> google</a> 
          <a href="Yahoohttp://www.Yahoo.com">Yahoo</a> 
          <a href="VisualVasicScripthttp://www.visualbasicscript.com">VisualVasicScript</a>
          <a href="DynamicDrivehttp://www.dynamicdrive.com">DynamicDrive</a>
          <a href="MDChttp://developer.mozilla.org">MDC</a>
      </div>
      <iframe id="content" name="content" src="about:blank"></iframe>
  </body>
</html>

Many Thanks

James

_____________________________

VBScript Documentation:

http://www.microsoft.com/downloads/details.aspx?FamilyID=01592c48-207d-4be1-8a76-1c4099d7bbb9&displaylang=en

(in reply to Fredledingue)

Post #: 13

RE: HTA Tabs - 10/29/2008 8:56:26 AM

Fredledingue

Posts: 383
Score: 0
Joined: 5/9/2005
From:
Status: offline

Sorry, I don't have time to work on this code as last time.... I suggest you to use image in img tags instead as style.

_____________________________

Fred

(in reply to morpheus83uk)

Post #: 14

RE: HTA Tabs - 10/29/2008 12:47:58 PM

TNO

Posts: 1402
Score: 16
Joined: 12/18/2004
From: thenewobjective.com
Status: offline

delete this:

<style type="text/css">
body
{
</style>

this is wrong:

style="background:test.JPG"

and specify a width and a height for the object you set a background image to

_____________________________

To iterate is human, to recurse divine. -- L. Peter Deutsch

(in reply to Fredledingue)

Post #: 15

RE: HTA Tabs - 10/29/2008 11:18:32 PM

morpheus83uk

Posts: 435
Score: 0
Joined: 8/21/2006
Status: offline

Thats great I have done it :)

Now all I need to do is make the images for the things and we will be away :)

Many Thanks

James

_____________________________

VBScript Documentation:

http://www.microsoft.com/downloads/details.aspx?FamilyID=01592c48-207d-4be1-8a76-1c4099d7bbb9&displaylang=en

(in reply to TNO)