Tabbertab

Door Piet Kampen op 05-11-2013 14:37 gewijzigd op 05-11-2013 18:14

1.605 views

Wie kan mij helpen met onderstaande script welke ik graag in een tabbaertab op mijn site wil plaatsen.
Alvast bedankt voor de hulp.

Vr groet,

Piet


<?php
error_reporting(E_ALL);

 $doPrintBNLWN = false;
include("BNLWN-mesomap.php");

?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=<?php print MESO_CHARSET; ?>" />
  <title>Benelux Weather Network</title>
  <?php print $BNLWN_CSS; ?>
</head>

<body style="font-family:Arial, Helvetica, sans-serif;">
<table width="99%">
<tr><td align="center">
  <table width="620">
  <tr><td style="text-align:left">
     <?php print $BNLWN_MAP; ?>
  </td></tr>
   <tr><td>
     <?php print $BNLWN_TABLE; ?>
   </td></tr>
   </table>
</td></tr>
</table>
</body>
</html>

Pipo Clown

05-11-2013 14:53

Zelfs Google geeft geen resultaten wanneer ik zoek naar "tabbaertab".

Voor de rest ? Het is me echt volkomen vaag wat je nu eigenlijk probeert te vragen :S

Piet Kampen

05-11-2013 15:10

Pipo Clown op 05/11/2013 14:53:37

Zelfs Google geeft geen resultaten wanneer ik zoek naar "tabbaertab".

Voor de rest ? Het is me echt volkomen vaag wat je nu eigenlijk probeert te vragen :S

Toevoeging op 05/11/2013 15:19:56:

Hoi,

Sorry het moet tabbertab zijn i.p.v. tabbaertab.
Nu komt deze pagina in een keer op mijn site - http://www.weerstation-sauwerd.nl/wxbnlwn.php
Deze zou ik dus graag via een tabber tab willen plaatsen.
Zodat hij dus in twee gedeeltes zichtbaar word en de gebruikers dus niet de hele pagina ziet maar dus een keuze kan maken uit een van de tabbladen.
Op tabblab 1 dus dit gedeelte: <?php print $BNLWN_MAP; ?>
En op tabblad 2 dit gedeelte: <?php print $BNLWN_TABLE; ?>
Op deze manier dus - http://www.meteosauwerd.nl/weather/index.php?p=31-1

Hoop dat het zo iets duidelijker is.

Vr groet,

Piet

Kris Peeters

05-11-2013 16:31

Laat me even tonen hoe tabber werkt.
Dit is zowat het minimum-voorbeeld van een werkend ding met tabber.

Wat jij kan doen, is die .css en .js zelf downloaden en in je map steken; (ik laat ze hier gehost door tabber zelf)


<link rel="StyleSheet" href="http://www.barelyfitz.com/projects/tabber/example.css" type="text/css" media="screen">
<script type="text/javascript">
  var tabberOptions = {manualStartup:false};
</script>
<script type="text/javascript" src="http://www.barelyfitz.com/projects/tabber/tabber.js"></script>
<div class="tabber">
  <div class="tabbertab" title="FOO titel">FOO inhoud</div>
  <div class="tabbertab" title="BAR titel">BAR inhoud</div>
</div>

Wat jouw ding betreft: als buitenste structuur moet je mijn divs overnemen.
Je kan die <table></table> wel integraal steken waar ik nu "FOO inhoud" heb staan. Ook de titel aanpassen.

Piet Kampen

06-11-2013 19:33 gewijzigd op 06-11-2013 19:38

Hallo,

Ik heb het nu zo staan als hieronder, maar er worden geen tabbladen zichtbaar.
Zie link: http://www.weerstation-sauwerd.nl/BNLWN/tabber.php
Wie kan mij vertellen wat ik fout heb staan of eventueel moet veranderen of toevoegen


<?php
error_reporting(E_ALL);

 $doPrintBNLWN = false;
include("BNLWN-mesomap.php");

?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=<?php print MESO_CHARSET; ?>" />
  <title>Benelux Weather Network</title>
<script type="text/javascript" src="sorttable.js"></script>
<script type="text/javascript" src="tabber.js"></script>

<!--  <link rel="stylesheet" href="example.css" TYPE="text/css" MEDIA="screen">
     <link rel="stylesheet" href="example-print.css" TYPE="text/css" MEDIA="print">
-->
<link rel="stylesheet" href="tabber.css" TYPE="text/css" MEDIA="screen">


<script type="text/javascript">

document.write('<style type="text/css">.tabber{display:visible;}<\/style');
</script>

             <?php print $BNLWN_CSS; ?>
</head>
<body style="font-family:Arial, Helvetica, sans-serif;">


<div class="tabber" style="width: 99%; margin: 0 auto;">
   <div class="tabbertab" style="padding: 0;" title="Sauwerd">Test-1</div>
   <div style="margin: auto; width: 620px;">
                <?php print $BNLWN_MAP; ?>
</div>

<div class="tabbertab" style="padding: 0; height: 600px;">
   <div class="tabbertab" title="Sauwerd">Test-2</div>
   <div style="width: 99%;">
                    <?php print $BNLWN_TABLE; ?>
</div>
</body>
</html>

Kris Peeters

07-11-2013 10:00 gewijzigd op 07-11-2013 10:00

Wel, lijn 3 van mijn code (uiteraard met de script tags).

Eerst
var tabberOptions = {manualStartup:false};

Dan pas tabber.js laden.

Mich

07-11-2013 10:05 gewijzigd op 07-11-2013 10:39

Ik krijg een hoop fouten op je tabber.php

GET http://****/BNLWN/example.css 404 (Not Found) tabber.php:10
Invalid CSS property value: visible tabber.php:1
GET http://****/BNLWN/BNLWN-images/ZW-sm.gif 404 (Not Found) tabber.php:938
GET http://****/BNLWN/BNLWN-images/WZW-sm.gif 404 (Not Found) tabber.php:1255
GET http://****/BNLWN/BNLWN-images/ZZO-sm.gif 404 (Not Found) tabber.php:1682
GET http://****/BNLWN/example-print.css 404 (Not Found) tabber.php:11
GET http://****/BNLWN/BNLWN-images/ZW.gif 404 (Not Found) tabber.php:3113
GET http://****/BNLWN/BNLWN-images/WZW.gif 404 (Not Found) tabber.php:3507
GET http://****/BNLWN/BNLWN-images/ZZO.gif 404 (Not Found) tabber.php:4075

Lijkt me dat je die 2 CSS bestanden wel nodig hebt?
[edit]Links verwijdert[/edit]

Piet Kampen

07-11-2013 10:21

Hallo iedereen die gereageerd heeft.

Heb het probleem inmidels opgelost, zie onderstaande link:

http://weerstation-sauwerd.nl/wxbnlwn.php

Wat die foutmeldingen van gifjes betreft klopt deze moeten nog toegevoegd worden.

Iedereen hartelijk dank voor de hulp en tips.

Vr groet,

Piet

Mich

07-11-2013 10:28 gewijzigd op 07-11-2013 10:46

Piet Kampen op 07/11/2013 10:21:24

Hallo iedereen die gereageerd heeft.

Heb het probleem inmidels opgelost, zie onderstaande link:

http://****/wxbnlwn.php

Wat die foutmeldingen van gifjes betreft klopt deze moeten nog toegevoegd worden.

Iedereen hartelijk dank voor de hulp en tips.

Vr groet,

Piet

Prima, ik bedoelde ook meer dat die de CSS niet kon vinden terwijl deze nodig lijken.
Nou zie ik dat die tabber/sorttable.js niet kan vinden, maar het werkt goed. Misschien dat je deze regel er dan gewoon uit kan halen.


Resource interpreted as Script but transferred with MIME type text/html: "http://****/2437770.php?2437770&@f16&@g0&@h2&@i1&@j13838163…&@s2049&@tnl&@u1440&@vhttp%3A%2F%2F****%2Fwxbnlwn.php&@w". js15.js:1
GET http://****/BNLWN/BNLWN-images/Z-sm.gif 404 (Not Found) tabber3.php:1253
GET http://****/BNLWN/BNLWN-images/ZW-sm.gif 404 (Not Found) tabber3.php:953
GET http://****/BNLWN/BNLWN-images/WZW-sm.gif 404 (Not Found) tabber3.php:1265
GET http://****/tabber/sorttable.js 404 (Not Found) tabber3.php:4297
GET http://****/BNLWN/BNLWN-images/Z.gif 404 (Not Found) tabber3.php:3461
GET http://****/BNLWN/BNLWN-images/ZW.gif 404 (Not Found) tabber3.php:3104
GET http://****/BNLWN/BNLWN-images/WZW.gif 404 (Not Found) tabber3.php:3479
XHR finished loading: "http://****/clientrawextra.txt?1383816388800". ajaxWDwx3.js:1814
XHR finished loading: "http://****/clientraw.txt?1383816388801". ajaxWDwx3.js:2641

[edit]Links verwijdert[/edit]

Piet Kampen

07-11-2013 13:04

Michael - op 07/11/2013 10:28:25

[quote="Piet Kampen op 07/11/2013 10:21:24"]
Hallo iedereen die gereageerd heeft.

Heb het probleem inmidels opgelost, zie onderstaande link:

http://****/wxbnlwn.php

Wat die foutmeldingen van gifjes betreft klopt deze moeten nog toegevoegd worden.

Iedereen hartelijk dank voor de hulp en tips.

Vr groet,

Piet


Resource interpreted as Script but transferred with MIME type text/html: "http://****/2437770.php?2437770&@f16&@g0&@h2&@i1&@j13838163…&@s2049&@tnl&@u1440&@vhttp%3A%2F%2F****%2Fwxbnlwn.php&@w". js15.js:1
GET http://****/BNLWN/BNLWN-images/Z-sm.gif 404 (Not Found) tabber3.php:1253
GET http://****/BNLWN/BNLWN-images/ZW-sm.gif 404 (Not Found) tabber3.php:953
GET http://****/BNLWN/BNLWN-images/WZW-sm.gif 404 (Not Found) tabber3.php:1265
GET http://****/tabber/sorttable.js 404 (Not Found) tabber3.php:4297
GET http://****/BNLWN/BNLWN-images/Z.gif 404 (Not Found) tabber3.php:3461
GET http://****/BNLWN/BNLWN-images/ZW.gif 404 (Not Found) tabber3.php:3104
GET http://****/BNLWN/BNLWN-images/WZW.gif 404 (Not Found) tabber3.php:3479
XHR finished loading: "http://****/clientrawextra.txt?1383816388800". ajaxWDwx3.js:1814
XHR finished loading: "http://****/clientraw.txt?1383816388801". ajaxWDwx3.js:2641

[edit]Links verwijdert[/edit]
[/quote]

Hoi Michael,

Heb het even aangepast en moet nu goed zijn.
Nogmaals bedankt voor de hulp en tips.

Vr groet,

Piet

Reageren

Inloggen om te reageren