Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Page 1 of 2 12 LastLast
Results 1 to 15 of 17
  1. #1
    New Coder
    Join Date
    Feb 2012
    Posts
    26
    Thanks
    2
    Thanked 0 Times in 0 Posts

    One works, duplicate doesnt, help!

    Hello Guys,

    im writing a big page with several different elements in it, and im stuck trying to duplicate a script.

    first one works "tab b" click each 'icon' and a .png file appears above it to show its selected.
    "tab c" same script and code seems to only work for first icon, and switch off when clicked on the others.

    been staring at this for sooooome time now, please can someone see what i have done wrong, as i dont really understand the code im using, im just a beginner.

    url is http://www.zakscustomcues.com/module...builder2.0.php

    much appreciated.
    steve

  • #2
    Senior Coder
    Join Date
    Dec 2010
    Posts
    2,355
    Thanks
    11
    Thanked 558 Times in 551 Posts
    Your biggest mistake:

    Each and every single id attribute must not be used for more than one element on the same document. This is most probably why only the first one works!

    Solution: Change from id to class

  • #3
    New Coder
    Join Date
    Feb 2012
    Posts
    26
    Thanks
    2
    Thanked 0 Times in 0 Posts
    ok,, changed them all to class, no different.

    here is the script for the two functions
    Code:
    function toggle1(Imagenumone){
    Sets = document.getElementsByClassName('togglesone');
    NumberOfSets = Sets.length;
    for (x = 0 ; x < NumberOfSets ; x++){
    if (x == Imagenumone){
    document.getElementById('toggleImageone' + x).src = 'images/cb/select.png';
    document.getElementById('contentDivone' + x).style.display = 'block';
    }else{
    document.getElementById('toggleImageone' + x).src = 'images/cb/noselect.png';
    document.getElementById('contentDivone' + x).style.display = 'none';
    }
    }
    }
     
    function toggle2(Imagenumtwo){
    Sets = document.getElementsByClassName('togglestwo');
    NumberOfSets = Sets.length;
    for (y = 0 ; y < NumberOfSets ; y++){
    if (y == Imagenumtwo){
    document.getElementById('toggleImagetwo' + y).src = 'images/cb/select.png';
    document.getElementById('contentDivtwo' + y).style.display = 'block';
    }else{
    document.getElementById('toggleImagetwo' + y).src = 'images/cb/noselect.png';
    document.getElementById('contentDivtwo' + y).style.display = 'none';
    }
    }
    }
    and the html elements are created from a while loop gathering the data from a database
    PHP Code:
    <?php                $toggleNo '1'
                        
    $count'0';
                        
    $query mysql_query("select * from ".$xoopsDB->prefix('zakscustomtimbers')." ") or die ('getting timbers for failed'); //where relevent to option -----  ad where optionone= 'yes' and timberavail = 'on'  ----
                        
    while($myrow mysql_fetch_array($query)){
                            
    $timberID $myrow['timberID'];
                            
    $src "images/cb/timbers/icons/$timberID.png"// set image path
                            
    if (file_exists($src)) { // see if image is there
                            
    $timberIDcomma "'".$timberID."'";
                            
    $timbername $myrow['timbername'];
                            
    $newtimbername substr($timbername,0,15); 
                            if (
    $newtimbername == $timbername) { $dots '';} else {$dots '..';}
                            
    $timbersci $myrow['timbersci'];
                            
    $timberblurb $myrow['timberblurb'];
                            
    $timberprice $myrow['timberprice'];
                            
    $clickvar "'variableOne$count'";
                            echo 
    '
    <div class=cbselector>
        <a class="togglesone" href="javascript:toggle'
    .$toggleNo.'('.$count.');" onClick="emailtwo='.$clickvar.';">
            <div class="cbselectortoggle">
                <img class="toggleimage" id="toggleImageone'
    .$count.'" src="images/cb/noselect.png"/>
            </div>
            <div class="cbtimbericon" >
                <img class="toggleimage" src="images/cb/timbers/icons/'
    .$timberID.'.png" />
            </div>
            <div class="cbtimbericonname">
                <p class="cbtimbernamep">'
    .$newtimbername.''.$dots.'</p>
            </div>
            <span>
                <div class="spandiv">
                    <div class="cbspanname">'
    .$newtimbername.'</div>
                    <div class="cbspansci">'
    .$timbersci.'</div>
                    <div class="cbspaninfo">
                        <div class="spanimg"><img src="images/cb/timbers/icons/'
    .$timberID.'.png" /></div>
                        <div class="spanblurb">'
    .$timberblurb.'</div>
                    </div>
                    <div class="cbspanjanka">'
    .$timberjanka.'</div>
                </div>
            </span>
        </a>
    </div>'
    ;
    $count++;
    }
    }
    ?>
    and the second one
    PHP Code:
            $count'0';
            
    $toggleNo'2';
            
    $query mysql_query("select * from ".$xoopsDB->prefix('zakscustomtimbers')." ") or die ('getting timbers for failed'); //where relevent to option -----  ad where optionone= 'yes' and timberavail = 'on'  ----
                        
    while($myrow mysql_fetch_array($query)){
                            
    $timberID $myrow['timberID'];
                            
    $src "images/cb/timbers/icons/$timberID.png"// set image path
                            
    if (file_exists($src)) { // see if image is there
                            
    $timberIDcomma "'".$timberID."'";
                            
    $timbername $myrow['timbername'];
                            
    $newtimbername substr($timbername,0,15); 
                            if (
    $newtimbername == $timbername) { $dots '';} else {$dots '..';}
                            
    $timbersci $myrow['timbersci'];
                            
    $timberblurb $myrow['timberblurb'];
                            
    $timberprice $myrow['timberprice'];
                            
    $clickvar "'variableOne$count'";
                            echo 
    '
    <div class=cbselector>
        <a class="togglestwo" href="javascript:toggle'
    .$toggleNo.'('.$count.');" onClick="email='.$clickvar.';">
            <div class="cbselectortoggle">
                <img class="toggleimage" id="toggleImagetwo'
    .$count.'" src="images/cb/noselect.png"/>
            </div>
            <div class="cbtimbericon" >
                <img class="toggleimage" src="images/cb/timbers/icons/'
    .$timberID.'.png" />
            </div>
            <div class="cbtimbericonname">
                <p class="cbtimbernamep">'
    .$newtimbername.''.$dots.'</p>
            </div>
            <span>
                <div class="spandiv">
                    <div class="cbspanname">'
    .$newtimbername.'</div>
                    <div class="cbspansci">'
    .$timbersci.'</div>
                    <div class="cbspaninfo">
                        <div class="spanimg"><img src="images/cb/timbers/icons/'
    .$timberID.'.png" /></div>
                        <div class="spanblurb">'
    .$timberblurb.'</div>
                    </div>
                    <div class="cbspanjanka">'
    .$timberjanka.'</div>
                </div>
            </span>
        </a>
    </div>'
    ;$count++;}

    thanks, any help would be greatly appreciated.
    steve.

  • #4
    Supreme Master coder! Old Pedant's Avatar
    Join Date
    Feb 2009
    Posts
    25,020
    Thanks
    75
    Thanked 4,323 Times in 4,289 Posts
    You have some illegal HTML there.
    Code:
    <a href="http://www.zakscustomcues.com/cart.php">
    				Shopping Cart
    			|
    There is no </a> tag to end that <a> tag.

    Also, you have
    Code:
        <span>
            <div class="spandiv">
            ...
            </div>
        </span>
    It's illegal to put a block element (<div>) inside and inline element (<span>).



    But you have one thing in there that should be easy to change:
    Code:
    	// toggle script times two
    	// this section must be repeated for each toggle
    I don't believe that.

    Look here:
    Code:
    <div id="groupone">
        <div class="cbselector">
    	<a href="#" onclick="emailtwo='variableOne1';return toggleany('one',1);">
    		<div class="cbselectortoggle">
    			<img class="toggleimage" src="images/cb/select.png" style="visibilty: hidden;" />
    		</div>
    		<div class="cbtimbericon" >
    			<img class="toggleimage" src="images/cb/timbers/icons/2.png" />
    		</div>
    		<div class="cbtimbericonname">
    			<p class="cbtimbernamep">Purpleheart</p>
    		</div>
    		<!-- illegal span omitted for brevity -->
    	</a>
        </div>
        <div class="cbselector">
             ...
        </div>
        ...
    </div><!-- end of groupone -->
    
    <div id="grouptwo">
        <div class="cbselector">
            ...
        </div>
        <div class="cbselector">
            ...
        </div>
        <div class=cbselector>
    	<a href="#" onClick="email='variableOne3';return toggleany('two',3)">
    		<div class="cbselectortoggle">
    			<img class="toggleimage" src="images/cb/select.png" style="visibility: hidden;" />
    		</div>
    		<div class="cbtimbericon" >
    			<img class="toggleimage" src="images/cb/timbers/icons/8.png" />
    		</div>
    		<div class="cbtimbericonname">
    			<p class="cbtimbernamep">Cocobolo</p>
    		</div>
    		<!-- illegal span omitted for brevity -->
    	</a>
        </div>
        <div class="cbselector">
            ...
        </div>
    </div><!-- end of grouptwo -->
    
    
    function toggleany(suffix,imagenum)
    {
        var group = document.getElementById("group" + suffix);
        var Sets = group.getElementsByTagName("a");
        for ( x = 0 ; x < Sets.length ; ++x )
        {
            var alink = Sets[x]; /* get reference to one a tag */
            var images = alink.getElementsByTagName("img"); /* find images in that tag */
    
            /* hide or show the select.png depending on which clicked */
            images[0].style.visibility = ( x == imagenum ) ? "visible" : "hidden";
    
            /* ditto for the contentDiv that matches suffix and imagenum */
            document.getElementById("contentDiv" + suffix + x).style.display = 
                   ( x == imagenum ) ? "block" : "none";
        }
    }
    See? One toggleany function. Just pass in the suffix ("one","two",etc.) along with the image number clicked on.

    And rather than swapping select/noselect images, just hide/unhide the one that is always there.

    No?
    An optimist sees the glass as half full.
    A pessimist sees the glass as half empty.
    A realist drinks it no matter how much there is.

  • #5
    New Coder
    Join Date
    Feb 2012
    Posts
    26
    Thanks
    2
    Thanked 0 Times in 0 Posts
    yes, there are probably a lot of errors in my code lol, im not trained, just doing the best i can.

    thanks for the code, ill give it a try, you also saved me repeating this 10 times, your new script will do all, hope it works

    i will report back
    steve

  • #6
    New Coder
    Join Date
    Feb 2012
    Posts
    26
    Thanks
    2
    Thanked 0 Times in 0 Posts
    ok, I have successfully implemented your code, took some adjustment to get it to work, mainly trying to discover the missing 'i' in visibility on your example :-/

    im a little slower at fault finding than most lol,

    can you believe though i Still have the exact same problem!!!

    i will put the code below
    ps the span thing is for a popup im searching for an alternate code to place the popup next to the cursor but they all use jquery and it seems to stop the tabs from working. for now i changed it to a table, its hidden in css with hover making it visible.

    thanks
    your script
    Code:
    function toggleany(suffix,imagenum)
    {
        var group = document.getElementById("group" + suffix);
        var Sets = group.getElementsByTagName("a");
        for ( x = 0 ; x < Sets.length ; ++x )
        {
            var alink = Sets[x]; /* get reference to one a tag */
            var images = alink.getElementsByTagName("img"); /* find images in that tag */
    
            /* hide or show the select.png depending on which clicked */
            images[0].style.visibility = ( x == imagenum ) ? "visible" : "hidden";
    
            /* ditto for the contentDiv that matches suffix and imagenum */
            document.getElementById("contentDiv" + suffix + x).style.display = 
                   ( x == imagenum ) ? "block" : "none";
        }
    }
    html for first tab
    Code:
                <div class="ftcontent" id="groupone"><!-- change options based on urltab seleced -->
                    <div id="headerDivImg">
                    	<div id="popup">
                        	<div id="titleTextImg">title for second tab content
                            </div>
    <div class="cbselector">    <a href="javascript:emailtwo='variableOne0';" onclick="javascript:toggleany('one','0');" >
        
    		<div class="cbselectortoggle">
    			<img class="toggleimage" src="images/cb/select.png" style="visibility: hidden;"/>
    		</div>
    		<div class="cbtimbericon" >
    			<img class="toggleimage" src="images/cb/timbers/icons/1.png" />
    		</div>
    		<div class="cbtimbericonname">
    			<p class="cbtimbernamep">Gabon Ebony</p>
    		</div>
    		<table class="spandiv"><tr><td>
    			<div class="popupouter">
    				<div class="cbspanname">Gabon Ebony</div>
    				<div class="cbspansci">Diospyros crassiflora</div>
    				<div class="cbspaninfo">
    					<div class="spanimg"><img src="images/cb/timbers/icons/1.png" /></div>
    					<div class="spanblurb">From equato....s ago</div>
    				</div>
    				<div class="cbspanjanka"></div>
    			</div>
    			
    		</td></tr></table>
    		</a>
    </div><div class="cbselector">    <a href="javascript:emailtwo='variableOne1';" onclick="javascript:toggleany('one','1');" >
        
    		<div class="cbselectortoggle">
    			<img class="toggleimage" src="images/cb/select.png" style="visibility: hidden;"/>
    		</div>
    		<div class="cbtimbericon" >
    			<img class="toggleimage" src="images/cb/timbers/icons/2.png" />
    		</div>
    		<div class="cbtimbericonname">
    			<p class="cbtimbernamep">Purpleheart</p>
    		</div>
    		<table class="spandiv"><tr><td>
    			<div class="popupouter">
    				<div class="cbspanname">Purpleheart</div>
    				<div class="cbspansci">Peltogyne paniculata</div>
    				<div class="cbspaninfo">
    					<div class="spanimg"><img src="images/cb/timbers/icons/2.png" /></div>
    					<div class="spanblurb">A brilliantly .......s and truck floors.</div>
    				</div>
    				<div class="cbspanjanka"></div>
    			</div>
    			
    		</td></tr></table>
    		</a>
    </div><div class="cbselector">    <a href="javascript:emailtwo='variableOne2';" onclick="javascript:toggleany('one','2');" >
        
    		<div class="cbselectortoggle">
    			<img class="toggleimage" src="images/cb/select.png" style="visibility: hidden;"/>
    		</div>
    		<div class="cbtimbericon" >
    			<img class="toggleimage" src="images/cb/timbers/icons/5.png" />
    code for second tab
    Code:
                <div class="ftcontent" id="grouptwo"><!-- change options based on urltab seleced -->
                    <div id="headerDivImg">
                    	<div id="popup">
                        	<div id="titleTextImg">title for second tab content</div>
                            <div class="cbselector">    <a href="javascript:emailtwo='variableOne0';" onclick="javascript:toggleany('two','0');" >
        
    		<div class="cbselectortoggle">
    			<img class="toggleimage" src="images/cb/select.png" style="visibility: hidden;"/>
    		</div>
    		<div class="cbtimbericon" >
    			<img class="toggleimage" src="images/cb/timbers/icons/1.png" />
    		</div>
    		<div class="cbtimbericonname">
    			<p class="cbtimbernamep">Gabon Ebony</p>
    		</div>
    		<table class="spandiv"><tr><td>
    			<div class="popupouter">
    				<div class="cbspanname">Gabon Ebony</div>
    				<div class="cbspansci">Diospyros crassiflora</div>
    				<div class="cbspaninfo">
    					<div class="spanimg"><img src="images/cb/timbers/icons/1.png" /></div>
    					<div class="spanblurb">From equatorial Africa,...that was used by the Egyptian Pharaohs over 3,000 years ago</div>
    				</div>
    				<div class="cbspanjanka"></div>
    			</div>
    			
    		</td></tr></table>
    		</a>
    </div><div class="cbselector">    <a href="javascript:emailtwo='variableOne1';" onclick="javascript:toggleany('two','1');" >
        
    		<div class="cbselectortoggle">
    			<img class="toggleimage" src="images/cb/select.png" style="visibility: hidden;"/>
    		</div>
    		<div class="cbtimbericon" >
    			<img class="toggleimage" src="images/cb/timbers/icons/2.png" />
    		</div>
    		<div class="cbtimbericonname">
    			<p class="cbtimbernamep">Purpleheart</p>
    		</div>
    		<table class="spandiv"><tr><td>
    			<div class="popupouter">
    				<div class="cbspanname">Purpleheart</div>
    				<div class="cbspansci">Peltogyne paniculata</div>
    				<div class="cbspaninfo">
    					<div class="spanimg"><img src="images/cb/timbers/icons/2.png" /></div>
    					<div class="spanblurb">A brilliantly colorn be used for wharf pilings and truck floors.</div>
    				</div>
    				<div class="cbspanjanka"></div>
    			</div>
    			
    		</td></tr></table>
    		</a>
    </div><div class="cbselector">    <a href="javascript:emailtwo='variableOne2';" onclick="javascript:toggleany('two','2');" >
        
    		<div class="cbselectortoggle">
    			<img class="toggleimage" src="images/cb/select.png" style="visibility: hidden;"/>
    		</div>
    		<div class="cbtimbericon" >
    			<img class="toggleimage" src="images/cb/timbers/icons/5.png" />
    		</div>
    		<div class="cbtimbericonname">
    			<p class="cbtimbernamep">Bloodwood</p>
    thanks
    steve

  • #7
    Supreme Master coder! Old Pedant's Avatar
    Join Date
    Feb 2009
    Posts
    25,020
    Thanks
    75
    Thanked 4,323 Times in 4,289 Posts
    Boggles my mind.

    I don't have all your images, of course.

    Can you put a page up (dummy url nobody will see, say) that uses that code and scheme without too much trouble?

    As for putting the span/table/div close to the cursor: It's not that hard to do without jQuery, honest.

    Here's a *VERY* old demo of mine (first written about 8 years ago) that does it with a popon calendar:
    http://www.clearviewdesign.com/Newbi...ndarDemo.shtml

    I'm not proud of the code, but this has worked in all browsers since MSIE 5 and Netscape 6. Roughly 8 years, I believe.
    An optimist sees the glass as half full.
    A pessimist sees the glass as half empty.
    A realist drinks it no matter how much there is.

  • #8
    Supreme Master coder! Old Pedant's Avatar
    Join Date
    Feb 2009
    Posts
    25,020
    Thanks
    75
    Thanked 4,323 Times in 4,289 Posts
    The guts of the calendar positioning code is here:
    Code:
        var x = 0;
        var y = 0;
        var node = here;
        while ( node.offsetParent != null )
        {
            x += node.offsetLeft;
            y += node.offsetTop;
            node = node.offsetParent;
        }
        var cal = document.getElementById('CALENDAR');
        cal.style.left = x + "px";
        cal.style.top  = (y + 24) + "px";
        cal.style.visibility='visible';
    You pass in a reference the object you want it near and then that little while loop does the magic. You can adjust the actual position relative to the object when you set the left and top positions.

    Passing this from the onclick would be the easiest way to pass the needed here value.

    That is, you add an argument to the toggleany function:
    Code:
    function toggleany(here,suffix,imagenum)
    And then invoke it via onclick="javascript:toggleany(this,'two','1');"

    Assuming we can get toggleany to work.
    An optimist sees the glass as half full.
    A pessimist sees the glass as half empty.
    A realist drinks it no matter how much there is.

  • #9
    New Coder
    Join Date
    Feb 2012
    Posts
    26
    Thanks
    2
    Thanked 0 Times in 0 Posts
    well, i have had all these elements working together on the one page, so i know it works, i tested it first before writing the real page, url as above
    http://www.zakscustomcues.com/module...builder2.0.php

    it just doesnt seem to work in the real page. hmmm, there are some slight differences, but fundamentally the same.

    yes i have seen many examples using jquery, it does seem simple, but it crashes the other elements i have going in the page like mootools. i have read you can get them both going at the same time, seemed a little complex for my abilities, i did give it a crack without success.

    i will play with your code and see if i can implement it for what i want. thanks.

    going to add the here and this suffix to see if it helps.

    the strange thing is the first one in tab c works, almost like it is reading the second set as only 1 instead of many.

    will report back.
    steve

  • #10
    New Coder
    Join Date
    Feb 2012
    Posts
    26
    Thanks
    2
    Thanked 0 Times in 0 Posts
    no change with the 'here and this' amendment.

    i will have no hair left by the end of this

    steve.

  • #11
    New Coder
    Join Date
    Feb 2012
    Posts
    26
    Thanks
    2
    Thanked 0 Times in 0 Posts
    still not working , pleeease help somebody, i have been stuck on this for three days now.

    thanks in advance
    steve

  • #12
    New Coder
    Join Date
    Feb 2012
    Posts
    26
    Thanks
    2
    Thanked 0 Times in 0 Posts
    FIXED - in re writing my page to do all my scripts with jquery instead of trying to use two, i found the problem ......

    wait for it .... the problem is 'two'

    the code for some reason doesnt like it, change it to a number and it works fine.

    first tab id="groupone" and in calling function toggleany(this,'one',1);
    second tab id="grouptwo" and in calling function toggleany(this,'two',1); doesnt :-/

    rewriting the page i tried numbers
    first tab id="group4" and in calling function toggleany(this,'4',1); works

    dont ask me why, maybe one of you supercoders will work it out one day :-)

    thanks for your help everyone, the revised script is much better anyway.

    regards
    steve

  • #13
    Supreme Master coder! Old Pedant's Avatar
    Join Date
    Feb 2009
    Posts
    25,020
    Thanks
    75
    Thanked 4,323 Times in 4,289 Posts
    WOW! That boggles my mind even more!

    When I get some time I'm going to go look at the code again!
    An optimist sees the glass as half full.
    A pessimist sees the glass as half empty.
    A realist drinks it no matter how much there is.

  • #14
    New Coder
    Join Date
    Feb 2012
    Posts
    26
    Thanks
    2
    Thanked 0 Times in 0 Posts
    OK , so its not quite fixed.

    go here
    http://www.zakscustomcues.com/module...builder2.0.php

    and you will see that tab b works for all timbers, and tab c will only toggle on for the first 10 timbers! what the!

    this is so strange, I now have this code in the new page three times, each one is different and i had to try random numbers to get it to work at all, and one tab they all work, the others vary.

    what the hell is going on!.
    steve

  • #15
    New Coder
    Join Date
    Feb 2012
    Posts
    26
    Thanks
    2
    Thanked 0 Times in 0 Posts
    ok, so since i cant get this to work i have gone back to basics, reading thats its not correct to have table and div inside an anchor tag, i have re written the code to remove this, also I was originally switching to html from php in the middle of the loop, so i removed that too just in case.
    I have checked for open tags and general errors that could cause this, also I have changed the tab style to not use mootools also, thinking that could have effected it.

    And STILL, after all this im getting the same problem (in fact it seems to be worse, it now only works on the first timber in the third tab)

    please see the new version of the page here
    http://www.zakscustomcues.com/module...builder2.1.php

    the script is
    Code:
    function toggleany(here,suffix,imagenum)
    {
        var group = document.getElementById("group" + suffix);
        var Sets = group.getElementsByTagName("a");
        for ( x = 0 ; x < Sets.length ; ++x )
        {
            var alink = Sets[x]; /* get reference to one a tag */
            var images = alink.getElementsByTagName("img"); /* find images in that tag */
    
            /* hide or show the select.png depending on which clicked */
            images[0].style.visibility = ( x == imagenum ) ? "visible" : "hidden";
    
            /* ditto for the contentDiv that matches suffix and imagenum */
            document.getElementById("contentDiv" + suffix + x).style.visibility = ( x == imagenum ) ? "visible" : "hidden";
        }
    }
    which seems straight forward, i changed the second half to visibility switching instead of display/block, you will see the first one (gabon ebony) works.
    the php code generating the html for the tab content is ...
    PHP Code:
    <div id="group3">
    <?php  $count'0';
    $query mysql_query("select * from ".$xoopsDB->prefix('zakscustomtimbers')." ") or die ('getting timbers for failed'); //where relevent to option -----  ad where optionone= 'yes' and timberavail = 'on'  ----
    while($myrow mysql_fetch_array($query)){
    $timberID $myrow['timberID'];
    $src "images/cb/timbers/icons/$timberID.png"// set image path
    if (file_exists($src)) { // see if image is there
    $timberIDcomma "'".$timberID."'";
    $timbername $myrow['timbername'];
    $newtimbername substr($timbername,0,15); 
    if (
    $newtimbername == $timbername) { $dots '';} else {$dots '..';}
    $timbersci $myrow['timbersci'];
    $timberblurb $myrow['timberblurb'];
    $timberprice $myrow['timberprice'];
    $clickvar "'variableOne$count'";
    echo 
    '
        <div class="cbselector" id="popup">
            <a onclick="javascript:'
    ;echo "toggleany(this,'3',$count ); emailone='variableOne$count';"; echo '">
                <img class="toggleimage" id="cbselectortoggle" src="images/cb/select.png" style="visibility: hidden;" />
                <img class="toggleimage" id="cbtimbericon" src="images/cb/timbers/icons/'
    .$timberID.'.png" />
                <em>'
    .$newtimbername.''.$dots.'</em>
                <span>
                        <em class="spanem">'
    .$newtimbername.'</em>
                        <strong>'
    .$timbersci.'</strong>
                        <img src="images/cb/timbers/icons/'
    .$timberID.'.png" />
                        <small>'
    .$timberblurb.'</small>
                        <b>'
    .$timberjanka.'</b>
                </span>
            </a>
        </div>'
    ;
    $count++;
    }
    }
    ?>
    <div id="spanclear"></div>    
    </div>
    which results in the html output of
    Code:
            
    <div id="groupone">
    	<div class="cbselector" id="popup">
    		<a onclick="javascript:toggleany(this,'one',0 ); emailone='variableOne0';">
    			<img class="toggleimage" id="cbselectortoggle" src="images/cb/select.png" style="visibility: hidden;" />
    			<img class="toggleimage" id="cbtimbericon" src="images/cb/timbers/icons/1.png" />
    			<em>Gabon Ebony</em>
    			<span>
    			<em class="spanem">Gabon Ebony</em>
    			<strong>Diospyros crassiflora</strong>
    			<img src="images/cb/timbers/icons/1.png" />
    			<small>From equatorial ..rk. Ebony is a treasured hardw... years ago</small>
    			<b></b>
    			</span>
    		</a>
    	</div>
    	<div class="cbselector" id="popup">
    		<a onclick="javascript:toggleany(this,'one',1 ); emailone='variableOne1';">
    			<img class="toggleimage" id="cbselectortoggle" src="images/cb/select.png" style="visibility: hidden;" />
    			<img class="toggleimage" id="cbtimbericon" src="images/cb/timbers/icons/2.png" />
    			<em>Purpleheart</em>
    			<span>
    			<em class="spanem">Purpleheart</em>
    			<strong>Peltogyne paniculata</strong>
    			<img src="images/cb/timbers/icons/2.png" />
    			<small>A brilliantly ......uck floors.</small>
    			<b></b>
    			</span>
    		</a>
    	  </div>							
              <div id="spanclear"></div>	
         </div>
    </li>
    just in case it helps, im creating this site on a xoops platform, not sure if thats relevant or not.

    thank you all for your help, im making this site for free for a friend, and really appreciate your assistance.
    regards
    steve


  •  
    Page 1 of 2 12 LastLast

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •