Tabbed Document Viewer Inline Window Problem

**nickkname** · 07-18-2011, 04:31 AM

1) Script Title: Tabbed Document Viewer

2) Script URL (on DD): http://www.dynamicdrive.com/dynamici...bdocviewer.htm

3) Describe problem:

I am unable to get the websites tabbed to appear in the window. They always just load on screen.

Below is the code I'm using. I won't post the page, though, since the site is adult content.

Code:

<html>
<head>

<style type="text/css">

/*Eric Meyer's based CSS tab*/

#tablist{
padding: 3px 0;
margin-left: 0;
margin-bottom: 0;
margin-top: 0.1em;
font: bold 14px Verdana;
}

#tablist li{
list-style: none;
display: inline;
margin: 0;
}

#tablist li a{
text-decoration: none;
padding: 3px 0.5em;
margin-left: 3px;
border: 1px none #778;
border-bottom: none;
background: pink;
}

#tablist li a:link, #tablist li a:visited{
color: blue;
}

#tablist li a:hover{
color: black;
background: pink;
border-color: pink;
}

#tablist li a.current{
background: white;
}

</style>

<script type="text/javascript">

/***********************************************
* Tabbed Document Viewer script- © Dynamic Drive DHTML code library (www.dynamicdrive.com)
* Modified by Raymond Angana rangana in dynamicdrive.com/forums
* First seen in dynamicdrive.com/forums
* Modification - Allow multiple tabbed content viewer
* This notice MUST stay intact for legal use
* Visit Dynamic Drive at http://www.dynamicdrive.com/ for full source code
***********************************************/

var selectedtablink=""
var tcischecked=false

function handlelink(aobject,targFrame){
selectedtablink=aobject.href
tcischecked=(document.tabcontrol && document.tabcontrol.tabcheck.checked)? true : false
if (document.getElementById && !tcischecked){
var tabobj=document.getElementById("tablist")
var tabobjlinks=tabobj.getElementsByTagName("A")
for (i=0; i<tabobjlinks.length; i++)
tabobjlinks[i].className=""
aobject.className="current"
document.getElementById(targFrame).src=selectedtablink
return false
}
else
return true
}

function handleview(e){
if (document.getElementById && e.checked){
if (selectedtablink!="")
window.location=selectedtablink
}
}

</script>

</head>
<body>

<ul id="tablist">
<li><a class="current" href="welcome.html" onClick="return handlelink(this)">Welcome!</a></li>
<li><a href="bio.html" onClick="return handlelink(this)">Bio</a></li>
<li><a href="videos.html" onClick="return handlelink(this)">Videos</a></li>
<li><a href="pictures.html" onClick="return handlelink(this)">Pictures</a></li>
</ul>
<iframe id="tabiframe" src="welcome.html" width="75%" height="750px"
scrolling="no" marginwidth="0" marginheight="0" frameborder="0" vspace="0" hspace="0"></iframe>

<form name="tabcontrol" style="margin-top:0">
</form>

</body>
</html>

**jscheuer1** · 07-18-2011, 08:14 AM

You've made some modifications to the markup and possibly to the script code as well. In any case, use this version of the script code:

Code:

<script type="text/javascript">

/***********************************************
* Tabbed Document Viewer script- © Dynamic Drive DHTML code library (www.dynamicdrive.com)
* Modified by Raymond Angana rangana in dynamicdrive.com/forums
* First seen in dynamicdrive.com/forums
* Modification - Allow multiple tabbed content viewer
* This notice MUST stay intact for legal use
* Visit Dynamic Drive at http://www.dynamicdrive.com/ for full source code
***********************************************/

var selectedtablink=""
var tcischecked=false

function handlelink(aobject,targFrame){
targFrame = targFrame || 'tabiframe';
selectedtablink=aobject.href
tcischecked= false
if (document.getElementById && !tcischecked){
var tabobj=document.getElementById("tablist")
var tabobjlinks=tabobj.getElementsByTagName("A")
for (i=0; i<tabobjlinks.length; i++)
tabobjlinks[i].className=""
aobject.className="current"
document.getElementById(targFrame).src=selectedtablink
return false
}
else
return true
}

function handleview(e){
if (document.getElementById && e.checked){
if (selectedtablink!="")
window.location=selectedtablink
}
}

</script>

Notes: That fixes the viewer for the code in your post. However, if any of these pages you want to open in the viewer have code on them to "break out of frames", there's nothing you can do about it unless you can remove that code from that/those page(s).

**nickkname** · 07-18-2011, 09:23 AM

Originally Posted by jscheuer1

You've made some modifications to the markup and possibly to the script code as well. In any case, use this version of the script code:

Code:

<script type="text/javascript">

/***********************************************
* Tabbed Document Viewer script- © Dynamic Drive DHTML code library (www.dynamicdrive.com)
* Modified by Raymond Angana rangana in dynamicdrive.com/forums
* First seen in dynamicdrive.com/forums
* Modification - Allow multiple tabbed content viewer
* This notice MUST stay intact for legal use
* Visit Dynamic Drive at http://www.dynamicdrive.com/ for full source code
***********************************************/

var selectedtablink=""
var tcischecked=false

function handlelink(aobject,targFrame){
targFrame = targFrame || 'tabiframe';
selectedtablink=aobject.href
tcischecked= false
if (document.getElementById && !tcischecked){
var tabobj=document.getElementById("tablist")
var tabobjlinks=tabobj.getElementsByTagName("A")
for (i=0; i<tabobjlinks.length; i++)
tabobjlinks[i].className=""
aobject.className="current"
document.getElementById(targFrame).src=selectedtablink
return false
}
else
return true
}

function handleview(e){
if (document.getElementById && e.checked){
if (selectedtablink!="")
window.location=selectedtablink
}
}

</script>

Notes: That fixes the viewer for the code in your post. However, if any of these pages you want to open in the viewer have code on them to "break out of frames", there's nothing you can do about it unless you can remove that code from that/those page(s).

Thank you! The pages just go to text, a video bar, and a pic slideshow, so I don't think those can break out of frames.

I took out everything on the pages and I used the code you gave me, but the pages still won't load inline.

I'm thinking it may be a browser problem.

**jscheuer1** · 07-18-2011, 11:17 AM

Instead of taking out everything, just replace the script part with the code in my post.

**nickkname** · 07-18-2011, 04:42 PM

Originally Posted by jscheuer1

Instead of taking out everything, just replace the script part with the code in my post.

Thanks!

It's working now

Thread: Tabbed Document Viewer Inline Window Problem

Thread Tools

Search Thread

Tabbed Document Viewer Inline Window Problem

Bookmarks

Bookmarks

Posting Permissions