Click here to Skip to main content
Rate this: bad
good
Please Sign up or sign in to vote.
Hey guys i have this accordion on a live app.
but i want to change it so that if you click on the text above the accordion it opens another html page.
here is the html and .JS file for that piece of the page!
working on
-vs express for windows phone
-phiegap/cordova1.9
-html5,CSS,javascript,jquery
-c#

any help will be appreciated
HTML
<div id="AccordionContainer" class="AccordionContainer"></div>
    <div onclick="runAccordion(1)">
      <div class="Accordiontitle" onselectstart="return false;">
        <input class="followThisRel" type="button" href="ItemPages.html"> Accordion Title</input>
        <br/>
        <a>POS556446x</a>
      </div>
    </div>
    <div id="Accordion1Content" class="AccordionContent" style="background-color:white; color:grey;">
      <form>
        <p>
          <label for="create" >Created by :</label>
          <input type="text" style="margin-left:60px;" size="22" id="create"/>
        </p>
        <p>
          <label for="createdate" >Created Date :</label>
          <input type="text" style="margin-left:43px;" size="22" id="createdate"/>
        </p>
        <p>
          <label for="process" >Process name :</label>
          <input type="text" style="margin-left:36px;" size="22" id="process"/>
        </p>
        <p>
          <label for="transtype">Transaction type :</label>
          <input type="text" style="margin-left:20px;" size="22" id="transtype"/>
        </p>
        <p>
          <label for="lastact">Last action :</label>
          <input type="text" style="margin-left:61px;" size="22" id="lastact"/>
        </p>
        <p>
          <label for="lastuser">Last user :</label>
          <input type="text" style="margin-left:73px;" size="22" id="lastuser"/>
        </p>
        <p>
          <label for="lastupd">Last update :</label>
          <input type="text" style="margin-left:55px;" size="22" id="lastupd"/>
        </p>
        <p>
          <label for="duration">Duration :</label>
          <input type="text" style="margin-left:78px;" size="22" id="duration"/>
        </p>
        <p>
          <label for="saved">Saved :</label>
          <input type="text" style="margin-left:93px;" size="22" id="saved"/>
        </p>
        <p>
          <label for="adhoc">Ad hoc user :</label>
          <input type="text" style="margin-left:53px;" size="22" id="adhoc"/>
        </p>
      </form>
    </div>
 
here is the .js file
 
var ContentHeight = 200;
    var TimeToSlide = 250.0;
 
    var openAccordion = '';
 
    function runAccordion(index) {
    var nID = "Accordion" + index + "Content";
    if (openAccordion == nID)
    nID = '';
 
    setTimeout("animate(" + new Date().getTime() + "," + TimeToSlide + ",'" + openAccordion + "','" + nID + "')", 33);
 
    openAccordion = nID;
    }
 
    function animate(lastTick, timeLeft, closingId, openingId) {
    var curTick = new Date().getTime();
    var elapsedTicks = curTick - lastTick;
 
    var opening = (openingId == '') ? null : document.getElementById(openingId);
    var closing = (closingId == '') ? null : document.getElementById(closingId);
 
    if (timeLeft <= elapsedTicks) {
    if (opening != null)
    opening.style.height = ContentHeight + 'px';
 
    if (closing != null) {
    closing.style.display = 'none';
    closing.style.height = '0px';
    }
    return;
    }
 
    timeLeft -= elapsedTicks;
    var newClosedHeight = Math.round((timeLeft / TimeToSlide) * ContentHeight);
 
    if (opening != null) {
    if (opening.style.display != 'block')
    opening.style.display = 'block';
    opening.style.height = (ContentHeight - newClosedHeight) + 'px';
    }
 
    if (closing != null)
    closing.style.height = newClosedHeight + 'px';
 
    setTimeout("animate(" + curTick + "," + timeLeft + ",'" + closingId + "','" + openingId + "')", 33);
    }
 
this is the piece of coding that should act as a "button" to navigate to the new page!
 
<input class="followThisRel" type="button" href="ItemPages.html"> Accordion Title</input>
 
please help Smile | :)
Posted 16-Oct-12 3:09am

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)

  Print Answers RSS
0 OriginalGriff 250
1 George Jonsson 175
2 Jochen Arndt 150
3 Kornfeld Eliyahu Peter 149
4 PIEBALDconsult 110
0 OriginalGriff 6,080
1 DamithSL 4,648
2 Maciej Los 4,087
3 Kornfeld Eliyahu Peter 3,624
4 Sergey Alexandrovich Kryukov 3,294


Advertise | Privacy | Mobile
Web03 | 2.8.141220.1 | Last Updated 16 Oct 2012
Copyright © CodeProject, 1999-2014
All Rights Reserved. Terms of Service
Layout: fixed | fluid

CodeProject, 503-250 Ferrand Drive Toronto Ontario, M3C 3G8 Canada +1 416-849-8900 x 100