Search Results

Search found 3584 results on 144 pages for 'vertical align'.

facebook twitter digg google delicious technorati stumbleupon myspace wordpress linkedin gmail igoogle windows live tumblr viadeo yahoo buzz yahoo mail yahoo bookmarks favorites email print

Page 12/144 | < Previous Page | 8 9 10 11 12 13 14 15 16 17 18 19  | Next Page >

  • Problem in vertical navigation menu using css sprites

    - by ShiVik
    Hello all I am trying to create to a vertical navigation menu using CSS sprites. I want to put in it a hover effect where the menu option slides out a bit. a:link { background: url(images/nav.png); background-position: -100px 0px; width: 150px; } a:hover { background: url(images/nav.png); background-position: -100px 0px; width: 160px; } So I am using the same image, I am just increasing its size to create a pop out effect. But my problem is that right now the image's size is increasing to the right. I want to keep the image's base aligned and its head should pop out. Here's my complete css code: #navmenu { left: 100px; margin: 0; padding: 0; position: absolute; top: 150px; width: 150px; z-index: 99; } #navmenu ul { list-style-type: none; margin: 0px; padding: 0px; } #navmenu ul li { line-height: 1.5em; padding: 0px; } #navimenu ul li a { color: black; display: block; font-weight: bold; height: 26px; padding: 0px 15px 0px 0px; text-align: right; width: 150px; } #navmenu a:link, #navmenu a:visited { background: url(images/nav.png) no-repeat; background-position: -150px 0px; width: 150px; } #navmenu a:hover { background: url(images/nav.png) no-repeat; background-position: -150px 0px; width: 160px; } Don't know how much if I've put the problem correctly but can somebody help me out here? Thanks

    Read the article

  • Why the vertical scroll bar moves automatically ?

    - by Misha Moroshko
    I don't understand why the vertical scroll bar moves automatically to the most top position when "Line 9" clicked, for example. Further clicks does not move the scroll bar. Could anyone explain why, and how to fix this ? I work with Firefox 3.6.3. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <body> <div> <table> <tr row='0'><td class='column1'>Line 0</td></tr> <tr row='1'><td class='column1'>Line 1</td></tr> <tr row='2'><td class='column1'>Line 2</td></tr> <tr row='3'><td class='column1'>Line 3</td></tr> <tr row='4'><td class='column1'>Line 4</td></tr> <tr row='5'><td class='column1'>Line 5</td></tr> <tr row='6'><td class='column1'>Line 6</td></tr> <tr row='7'><td class='column1'>Line 7</td></tr> <tr row='8'><td class='column1'>Line 8</td></tr> <tr row='9'><td class='column1'>Line 9</td></tr> </table> </div> </body> $(document).ready(function() { $(".column1").each(function(index) { $(this).after("<td class='column2'>Details " + index + "</td>"); $(this).toggle(function() { $("[row='" + index + "'] .column2").fadeIn("fast") }, function() { $("[row='" + index + "'] .column2").fadeOut("fast") }); }); }); div { overflow: auto; height: 100px; width: 300px; border: 1px solid blue; } .column1 { cursor: pointer; } .column2 { display: none; }

    Read the article

  • Why won't my images align properly?

    I'm trying to make a dynamically sizable title banner, using fairly simple image tricks. I place the banner image in a table cell, and set the background-image of the table row to a one-pixel-wide repeat of the banner's right-most pixel column. Thus, the banner image appears to stretch to fit the screen width without stretching the logo. The code below is my entire page so far, and the problem is shown in a red circle in the screenshot. This is the transition where the main image ends and the one-pixel-wide background image begins. It appears that the one-pixel-wide bar at the end is compressed by one pixel - making the tops align properly, while the bottoms are one pixel off. I should add that I have checked the images more than once to make cure they the image data is correct. They are %100 accurate as far as MSPaint is concerned. <%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head runat="server"> <title></title> </head> <body bgcolor="#000000"> <form id="form1" runat="server"> <div> <table style="width:100%; "> <tr style="background-image: url('Images/Banners/WebBannerWideBar.png')"> <!--WebBannerWideBar is 1x100 px--> <td> <img alt="Angry Octopus" src="Images/Banners/WebBannerWide.png" /> <!--WebBannerWide is 760x100 px--> </td> </tr> </table> </div> </form> </body> </html>

    Read the article

  • Align 2 columns of text links

    - by andu
    Hi , I have this code in my block and i would like to have the two columns left and right . Now the 2-nd one is under the first column . <style type="text/css"> a img{border:none;} #planninglaunchbox { background:#f3f8e7; color:#1f1f1f; font:normal 11px Arial,sans-serif; margin:0 10px 10px 0; overflow:hidden; width:235px; } #planninglaunchbox .inner { padding:10px 0 10px 10px; } #planninglaunchbox a{color:#1f1f1f;text-decoration:none;} #planninglaunchbox a:active, #planninglaunchbox a:hover{text-decoration:underline;color:#579BC3;} #planninglaunchbox h3 { color:#1f1f1f; font:normal 12px Georgia,serif; margin:0 0 5px; text-transform:lowercase; width:215px; } #planninglaunchbox h4 { font:bold 12px Arial,sans-serif; margin:0 0 10px; } #planninglaunchbox ul { list-style:none; margin:0 0 5px; padding:0; } #planninglaunchbox ul.first{margin-right:10px;} #planninglaunchbox ul.first, #planninglaunchbox ul.last { float:left; } #planninglaunchbox ul li { background:none; margin-bottom:5px; padding:0; } #planninglaunchbox ul li img { margin-right:6px; vertical-align:middle; } #planninglaunchbox .seeall { clear:both; margin:0; padding:0; width:auto; } </style> <div id="planninglaunchbox"> <div class="inner"> <h3> Theme</h3> <ul class="first"> !--Some links-- </ul> <ul class="last"> !--Some links-- </ul> </div> </div>

    Read the article

  • iframe 100% height causing vertical scrollbar

    - by Keevon
    I'm trying to layout a design that has a fixed height header at the top of the screen, and then an iframe below taking up the remaining space. The solution I came up with is as follows: <!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" xml:lang="en" lang="en"> <head> <style type="text/css"><!-- * {margin: 0;} html, body {height: 100%;width: 100%;margin: 0;padding: 0;}--></style> </head> <body> <div style="height:70px;background-color:blue;"></div> <div style="position:absolute;top:70px;bottom:0;left:0;right:0;"> <iframe src="http://www.google.com" frameborder="0" style="border:0;padding:0;margin:0;width:100%;height:100%;"></iframe> </div> </body> </html> Essentially, I'm creating an absolutely positioned div below the header and sizing it to take up the rest of the space, then putting the full size iframe in there. The problem I'm running into is that if you paste the code exactly as seen below, using XHTML Strict, in each browser (tested w/ chrome/safari/ie8) you will see a vertical scroll bar with a few pixels of white space below the div. Doing some experimenting, I found that if I remove the doctype completely it works in safari/chrome, but IE gets even worse, setting the iframe height to 300px or so. If I set the doctype to transitional, it works in safari/chrome but has the same problem as in the strict case for IE8. If I use the HTML5 doctype, it has the same problem as strict in all browsers. Finally, if I remove the iframe in any of these cases, everything is laid out just fine. Anyone have any ideas?

    Read the article

  • vertical navigation that shows hidden submenu on click using JQuery

    - by user346602
    Hi, I am trying to make a menu that works like the one on this flash site: http://elevensix.de/ When I click "portfolio", only then to the subnavigation links reveal themselves. Right now I have only managed to get a typical vertical "reveal subnavigation on hover menu" working. What is required is that once the appropriate menu item it cicked, its submenu shows. This submenu remains revealed as the submenu items are hovered over then selected. When the submenu item is selected, the content shows, and both the menu and submenu remain visible (the selected menu and submenu item are given a distinct colour to show the navigation path). Whew. Here is my html: <div id="nav"> <ul> <li><a href="#">about</a></li> <li><a href="#">testimonials</a> <ul> <li><a href="#">testimonial1</a></li> <li><a href="#">testimonial2</a></li> <li><a href="#">testimonial3</a></li> <li><a href="#">testimonial4</a></li> </ul> </li> <li><a href="#">Services</a> <ul> <li><a href="#">services1</a></li> <li><a href="#">services2</a></li> <li><a href="#">services3</a></li> <li><a href="#">services4</a></li> </ul> </li> <li><a href="#">Gallery</a></li> <li><a href="#">Contact</a></li> </ul> </div><!--end #nav--> and here is my css: #nav { width:160px; position: relative; top: 250px; left: 20px; } #nav ul { margin:0px; padding:0px; } #nav ul li { line-height:24px; list-style:none; } #nav a { text-decoration: none; color: #9d9fa2; } #nav ul li a:hover { position:relative; color: #00aeef; } #nav ul ul { display:none; position:absolute; left:160px; top:4px; } #nav ul li:hover ul { display:block; color: #00aeef; } #nav ul ul li { width:160px; float:left; display:inline; line-height:16px; } .selected { color: #00aeef !important; } Should I be giving the submenus a class so that I can hide then show them? And where would the class be applied? To the ul? could I use the same class for both submenus? Am I wrong in how I am applying the display:none values for this purpose? Many thanks to all the clever people on here.

    Read the article

  • i have made a from and want to connect it to a oracle 10g data base using php.can you please assume

    - by nachiket-panse
    http://www.freecsstemplates.org Released for free under a Creative Commons Attribution 2.5 License -- Sitename.com by Free Css Templates MANAGEMEINT INFORMATION SYSTEM   <p class="style2">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;REGISTRY ENTRY FORM </p> <form id="form2" method="post" action=""> <p align="center">&nbsp;</p> <p align="center"><span class="style3">JOB DESCRIPTION :</span>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <textarea name="textarea"></textarea> </p> <p align="center"><span class="style3">QUANTITY :</span>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <input type="text" name="textfield5" /> </p> <p align="center">&nbsp;<span class="style3">CONTACT PERSON </span>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <input type="text" name="textfield3" /> </p> <p align="center">&nbsp;</p> <p align="center"><span class="style3">DIVISION CODE: <textarea name="textarea3"></textarea> </span></p> <p align="center"><span class="style3">ACCEPTANCE DATE </span>: <input type="text" name="textfield4" /> </p> <p align="center"><span class="style3">REFERENCE NUMBER :</span> <input type="text" name="textfield2" /> </p> <p align="center"><span class="style3">CLASSIFICATION :</span>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <input type="text" name="textfield" /></p> <p align="center">&nbsp;</p> <p align="center"><span class="style3">CUMULATIVE COST: </span> <select name="select"> </select> </p> <p align="center"><span class="style3">PLANNING ENGR: </span> <textarea name="textarea2"></textarea> </p> <p align="center"><span class="style3">PLANNING: </span> <input type="text" name="textfield6" /> </p> <p align="center"> <span class="style3">FILL THE COMPLETION DATE: </span> <input type="text" name="textfield7" /> </p> <p align="center"><span class="style3">REMARKS: </span> <input type="text" name="textfield8" /> </p> <p align="center">&nbsp;</p> <p align="center"> <input type="submit" name="SAVE" value="SAVE" /> <input type="submit" name="Submit2" value="LIST" /> <input type="submit" name="Submit" value="ADD" /> <input type="submit" name="Submit3" value="CANCEL" /> <input type="submit" name="BACK" value="BACK" /></p> <p align="center">&nbsp;</p> <p align="center">&nbsp;</p> <p align="center">&nbsp;</p> <p align="center">&nbsp;</p> <p align="center">&nbsp;</p> </form> <p align="center" class="style2">&nbsp;</p>

    Read the article

  • Java Box Class: Unsolvable: aligning components to the left or right

    - by user323186
    I have been trying to left align buttons contained in a Box to the left, with no success. They align left alright, but for some reason dont shift all the way left as one would imagine. I attach the code below. Please try compiling it and see for yourself. Seems bizarre to me. Thanks, Eric import java.awt.Dimension; import java.awt.event.ActionEvent; import java.awt.event.ActionListener; import java.io.BufferedReader; import java.io.File; import java.io.FileNotFoundException; import java.io.FileReader; import java.io.IOException; import javax.swing.Box; import javax.swing.BoxLayout; import javax.swing.JButton; import javax.swing.JFileChooser; import javax.swing.JFrame; import javax.swing.JMenu; import javax.swing.JMenuBar; import javax.swing.JMenuItem; import javax.swing.JScrollPane; import javax.swing.JTextArea; public class MainGUI extends Box implements ActionListener{ //Create GUI Components Box centerGUI=new Box(BoxLayout.X_AXIS); Box bottomGUI=new Box(BoxLayout.X_AXIS); //centerGUI subcomponents JTextArea left=new JTextArea(), right=new JTextArea(); JScrollPane leftScrollPane = new JScrollPane(left), rightScrollPane = new JScrollPane(right); //bottomGUI subcomponents JButton encrypt=new JButton("Encrypt"), decrypt=new JButton("Decrypt"), close=new JButton("Close"), info=new JButton("Info"); //Create Menubar components JMenuBar menubar=new JMenuBar(); JMenu fileMenu=new JMenu("File"); JMenuItem open=new JMenuItem("Open"), save=new JMenuItem("Save"), exit=new JMenuItem("Exit"); int returnVal =0; public MainGUI(){ super(BoxLayout.Y_AXIS); initCenterGUI(); initBottomGUI(); initFileMenu(); add(centerGUI); add(bottomGUI); addActionListeners(); } private void addActionListeners() { open.addActionListener(this); save.addActionListener(this); exit.addActionListener(this); encrypt.addActionListener(this); decrypt.addActionListener(this); close.addActionListener(this); info.addActionListener(this); } private void initFileMenu() { fileMenu.add(open); fileMenu.add(save); fileMenu.add(exit); menubar.add(fileMenu); } public void initCenterGUI(){ centerGUI.add(leftScrollPane); centerGUI.add(rightScrollPane); } public void initBottomGUI(){ bottomGUI.setAlignmentX(LEFT_ALIGNMENT); //setBorder(BorderFactory.createLineBorder(Color.BLACK)); bottomGUI.add(encrypt); bottomGUI.add(decrypt); bottomGUI.add(close); bottomGUI.add(info); } @Override public void actionPerformed(ActionEvent arg0) { // find source of the action Object source=arg0.getSource(); //if action is of such a type do the corresponding action if(source==close){ kill(); } else if(source==open){ //CHOOSE FILE File file1 =chooseFile(); String input1=readToString(file1); System.out.println(input1); left.setText(input1); } else if(source==decrypt){ //decrypt everything in Right Panel and output in left panel decrypt(); } else if(source==encrypt){ //encrypt everything in left panel and output in right panel encrypt(); } else if(source==info){ //show contents of info file in right panel doInfo(); } else { System.out.println("Error"); //throw new UnimplementedActionException(); } } private void doInfo() { // TODO Auto-generated method stub } private void encrypt() { // TODO Auto-generated method stub } private void decrypt() { // TODO Auto-generated method stub } private String readToString(File file) { FileReader fr = null; try { fr = new FileReader(file); } catch (FileNotFoundException e1) { e1.printStackTrace(); } BufferedReader br=new BufferedReader(fr); String line = null; try { line = br.readLine(); } catch (IOException e) { e.printStackTrace(); } String input=""; while(line!=null){ input=input+"\n"+line; try { line=br.readLine(); } catch (IOException e) { e.printStackTrace(); } } return input; } private File chooseFile() { //Create a file chooser final JFileChooser fc = new JFileChooser(); returnVal = fc.showOpenDialog(fc); return fc.getSelectedFile(); } private void kill() { System.exit(0); } public static void main(String[] args) { // TODO Auto-generated method stub MainGUI test=new MainGUI(); JFrame f=new JFrame("Tester"); f.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE); f.setJMenuBar(test.menubar); f.setPreferredSize(new Dimension(600,400)); //f.setUndecorated(true); f.add(test); f.pack(); f.setVisible(true); } }

    Read the article

  • Div horizontal aligning, one fixed, one adaptive

    - by Dorian McHensie
    Hello everyone. I would like to create a vertical splitted site structure using two divs: My intention is to have d2 next to d1 in a horizontal align structure (same line). What i get is not this. In fact using that code, d2 does not take the remaining space, but collapses to the min width. if I use WRONG because d2 goes down and takes all the space (but both divs are in different lines). HOW TO REACH MY OBJECTIVE? Is there a design pattern for this problem???? Thanks.

    Read the article

  • ZF2 Vertical Form

    - by yunhasnawa
    I created a simple form in typical ZF2 application. The form class code is just a modified code provided by Zend's Album example. <?php namespace Admin\Form; use Zend\Form\Form; class CityForm extends Form { public function __construct($name = null) { parent::__construct('city'); $this->setAttribute('method', 'post'); $this->add(array( 'name' => 'id', 'attributes' => array( 'type' => 'hidden', ), )); $this->add(array( 'name' => 'name', 'attributes' => array( 'type' => 'text' ), 'options' => array( 'label' => 'Name', ), )); $this->add(array( 'name' => 'province', 'attributes' => array( 'type' => 'text' ), 'options' => array( 'label' => 'Province', ), )); $this->add(array( 'name' => 'country', 'attributes' => array( 'type' => 'text' ), 'options' => array( 'label' => 'Country', ), )); $this->add(array( 'name' => 'coordinate', 'attributes' => array( 'type' => 'text' ), 'options' => array( 'label' => 'Coordinate', ), )); $this->add(array( 'name' => 'submit', 'attributes' => array( 'type' => 'submit', 'value' => 'Save', 'id' => 'submitButton', ), )); } } And call it like this in CityController, a typical controller extends AbstractActionController: public function addAction() { $form = new CityForm(); $viewData = array( 'form' => $form ); return new ViewModel($viewData); } Finally in view I echo it like this: <?php $title = 'Add New City'; ?> <?php $this->headtitle($title); ?> <h1><?php echo $this->escapehtml($title); ?></h1> <?php $form = $this->form; ?> <?php $form->setAttribute('action', $this->url('city', array('action' => 'add'))); ?> <?php $form->prepare(); ?> <?php echo $this->form()->openTag($form); echo $this->formHidden($form->get('id')); echo $this->formRow($form->get('name')); echo $this->formRow($form->get('province')); echo $this->formRow($form->get('country')); echo $this->formRow($form->get('coordinate')); echo $this->formSubmit($form->get('submit')); echo $this->form()->closeTag(); ?> What I expected to see is a vertical form like this: But what i got is an ugly form like this: What's wrong with my code? Please help. EDIT: When I inspect element, the form generated is strange. The <input> element is inside the <label> element. <form id="city" name="city" method="post" action="/karciscus/public/admin/city/add"> <input type="hidden" value="" name="id"> <label> <span>Name</span><input type="text" value="" name="name"> </label> <label> <span>Province</span><input type="text" value="" name="province"> </label> <label> <span>Country</span><input type="text" value="" name="country"> </label> <label> <span> Coordinate</span><input type="text" value="" name="coordinate"> </label> <input type="submit" value="Save" id="submitButton" name="submit"> </form> I'm pretty sure it is the cause of my ugly rendered form. I think it is not supposedly like that. How to fix it?

    Read the article

  • 3 div independently relative and top aligned

    - by Knu
    I have 3 div top aligned that should be relative to a previous div (not between them so i can't use floats or position:inline-block either). If you set display:none on 2 divs the last one shouldn't move. I can't use position:absolute because there's a relative footer underneath. I tried using a wrapper but it can't work cause the height of the divs is not fixed. The height of the wrapper gets completely ignored anyway (by the following footer) unless Im using relative children. vertical-align:top doesn't work either. Any ideas?

    Read the article

  • unnecessary vertical scrollbar in ie6

    - by tirso
    hi to all does any could help me how to remove unnecessary scroll bar in ie6. I have already put overflow-y: hidden; but still the same output. thanks in advance here is my url http://webberzsoft.com/clients/csslayouttest/template_new.php here is my css * {margin:0;padding:0;}/*for demo purposes only, use a proper reset in your final layout*/ html,body { overflow: auto; height:100%; } body { font-size:100%; background:#777; } #wrapper{ min-height:99%; width: 1240px; margin:0 auto; background: #FFFFFF; border-left:1px solid #000; border-right:1px solid #000; } #header { background:#77F; border-bottom:1px solid #000; height: 70px; } #content{/*just to create top padding without tampering with min-height:100% on #inner*/ padding:10px 0; overflow:hidden;/*contain floats*/ } #left-index { float:left; width:220px; } #right-index { float:right; width:180px; } #middle-index { float:left; width:840px; overflow:hidden;/*contain floats*/ } #left-home { float:left; width:300px; } #right-home { float:right; width:940px; } here is my html <div id="wrapper"> <div id="header"> <h1 align="right">Fixed Header</h1> <h3>IE6 gets an expression</h3> </div> <div id="content"> <div id="left-index"> <h3>Left</h3> <p>Lorem ipsum dolor sit amet consectetuer quis tempus tristique facilisi Vestibulum. Gravida rhoncus orci leo neque mattis felis Sed et tincidunt tellus. Massa ac condimentum elit ridiculus eget urna wisi id Suspendisse ullamcorper.</p> <p>Hendrerit eros ridiculus urna ipsum leo a ac sed tortor nisl. Tincidunt Morbi justo dis odio sit non sapien enim a augue. Sapien odio dui est Sed nisl id id malesuada sagittis et.</p> <p>Lorem ipsum dolor sit amet consectetuer quis tempus tristique facilisi Vestibulum. Gravida rhoncus orci leo neque mattis felis Sed et tincidunt tellus. Massa ac condimentum elit ridiculus eget urna wisi id Suspendisse ullamcorper.</p> <p>Hendrerit eros ridiculus urna ipsum leo a ac sed tortor nisl. Tincidunt Morbi justo dis odio sit non sapien enim a augue. Sapien odio dui est Sed nisl id id malesuada sagittis et.</p> <p>Lorem ipsum dolor sit amet consectetuer quis tempus tristique facilisi Vestibulum. Gravida rhoncus orci leo neque mattis felis Sed et tincidunt tellus. Massa ac condimentum elit ridiculus eget urna wisi id Suspendisse ullamcorper.</p> <p>Hendrerit eros ridiculus urna ipsum leo a ac sed tortor nisl. Tincidunt Morbi justo dis odio sit non sapien enim a augue. Sapien odio dui est Sed nisl id id malesuada sagittis et.</p> <p>Lorem ipsum dolor sit amet consectetuer quis tempus tristique facilisi Vestibulum. Gravida rhoncus orci leo neque mattis felis Sed et tincidunt tellus. Massa ac condimentum elit ridiculus eget urna wisi id Suspendisse ullamcorper.</p> <p>Hendrerit eros ridiculus urna ipsum leo a ac sed tortor nisl. Tincidunt Morbi justo dis odio sit non sapien enim a augue. Sapien odio dui est Sed nisl id id malesuada sagittis et.</p> <p>Lorem ipsum dolor sit amet consectetuer quis tempus tristique facilisi Vestibulum. Gravida rhoncus orci leo neque mattis felis Sed et tincidunt tellus. Massa ac condimentum elit ridiculus eget urna wisi id Suspendisse ullamcorper.</p> <p>Hendrerit eros ridiculus urna ipsum leo a ac sed tortor nisl. Tincidunt Morbi justo dis odio sit non sapien enim a augue. Sapien odio dui est Sed nisl id id malesuada sagittis et.</p> <p>Lorem ipsum dolor sit amet consectetuer quis tempus tristique facilisi Vestibulum. Gravida rhoncus orci leo neque mattis felis Sed et tincidunt tellus. Massa ac condimentum elit ridiculus eget urna wisi id Suspendisse ullamcorper.</p> </div> <div id="middle-index"> <h3>Middle</h3> <p>Lorem ipsum sed pede non adipiscing nulla lacinia ipsum quis ac Integer. Ut consectetuer Cras fringilla Ut non gravida morbi Maecenas semper vel. Vestibulum quis In Nulla Vivamus Sed feugiat Quisque et ipsum tincidunt. Semper vitae cursus metus risus enim gravida tellus id dignissim nec. Justo laoreet dui commodo Integer malesuada vel quis vel consequat metus. Nec id dolor Aliquam Nullam gravida libero montes nunc ante Nulla. Tortor id.</p> <p>Lorem ipsum sed pede non adipiscing nulla lacinia ipsum quis ac Integer. Ut consectetuer Cras fringilla Ut non gravida morbi Maecenas semper vel. Vestibulum quis In Nulla Vivamus Sed feugiat Quisque et ipsum tincidunt. Semper vitae cursus metus risus enim gravida tellus id dignissim nec. Justo laoreet dui commodo Integer malesuada vel quis vel consequat metus. Nec id dolor Aliquam Nullam gravida libero montes nunc ante Nulla. Tortor id.</p> <p class="lgmarg">testing text for scrolling</p> <p class="lgmarg">testing text for scrolling</p> <p class="lgmarg">testing text for scrolling</p> <p class="lgmarg">testing text for scrolling</p> <p class="lgmarg">testing text for scrolling</p> <p class="lgmarg">testing text for scrolling</p> <p class="lgmarg">testing text for scrolling</p> <p class="lgmarg">testing text for scrolling</p> <p class="lgmarg">testing text for scrolling</p> <p class="lgmarg">testing text for scrolling</p> </div> <div id="right-index"> <h3>Right</h3> <p>Lorem ipsum dolor sit amet consectetuer quis tempus tristique facilisi Vestibulum. Gravida rhoncus orci leo neque mattis felis Sed et tincidunt tellus. Massa ac condimentum elit ridiculus eget urna wisi id Suspendisse ullamcorper.</p> <p>Hendrerit eros ridiculus urna ipsum leo a ac sed tortor nisl. Tincidunt Morbi justo dis odio sit non sapien enim a augue. Sapien odio dui est Sed nisl id id malesuada sagittis et.</p> </div> </div><!--end content--> </div>

    Read the article

  • vertical accordion from horizontal

    - by Sify Juhy
    //# jQuery - Horizontal Accordion //# Version 2.00.00 Alpha 1 //# //# portalZINE(R) - New Media Network //# http://www.portalzine.de //# //# Alexander Graef //# [email protected] //# //# Copyright 2007-2009 (function($) { $.hrzAccordion = { setOnEvent: function(i, container, finalWidth, settings){ $("#"+container+"Handle"+i).bind(settings.eventTrigger,function() { var status = $('[rel='+container+'ContainerSelected]').data('status'); if(status ==1 && settings.eventWaitForAnim === true){ return false; } if( $("#"+container+"Handle"+i).attr("rel") != container+"HandleSelected"){ settings.eventAction; $('[id*='+container+'Handle]').attr("rel",""); $('[id*='+container+'Handle]').attr("class",settings.handleClass); $("#"+container+"Handle"+i).addClass(settings.handleClassSelected); $("."+settings.contentWrapper).css({width: finalWidth+"px" }); switch(settings.closeOpenAnimation) { case 1: if($('[rel='+container+'ContainerSelected]').get(0) ){ $('[rel='+container+'ContainerSelected]').data('status',1); //current_width = $('[rel='+container+'ContainerSelected]').width(); $('[rel='+container+'ContainerSelected]').animate({width: "0px",opacity:"0"}, { queue:true, duration:settings.closeSpeed ,easing:settings.closeEaseAction,complete: function(){ $('[rel='+container+'ContainerSelected]').data('status',0); } ,step: function(now){ width = $(this).width(); //new_width = finalWidth- (finalWidth * (width/current_width)); new_width = finalWidth - width; $('#'+container+'Content'+i).width(Math.ceil(new_width)).css("opacity","1"); }}); }else{ $('[rel='+container+'ContainerSelected]').data('status',1); $('#'+container+'Content'+i).animate({width: finalWidth,opacity:"1"}, { queue:false, duration:settings.closeSpeed ,easing:settings.closeEaseAction,complete: function(){ $('[rel='+container+'ContainerSelected]').data('status',0); }}); } break; case 2: $('[id*='+container+'Content]').css({width: "0px"}); $('#'+container+'Content'+i).animate({width: finalWidth+"px",opacity:"1"}, { queue:false, duration:settings.openSpeed ,easing:settings.openEaseAction, complete: settings.completeAction }); break; } $('[id*='+container+'Content]').attr("rel",""); $("#"+container+"Handle"+i).attr("rel",container+"HandleSelected"); $("#"+container+"Content"+i).attr("rel",container+"ContainerSelected"); } }); } }; $.fn.extend({ hrzAccordionLoop: function(options) { return this.each(function(a){ var container = $(this).attr("id") || $(this).attr("class"); var elementCount = $('#'+container+' > li, .'+container+' > li').size(); var settings = $(this).data('settings'); variable_holder="interval"+container ; var i =0; var loopStatus = "start"; variable_holder = window.setInterval(function(){ $("#"+container+"Handle"+i).trigger(settings.eventTrigger); if(loopStatus =="start"){ i = i + 1; }else{ i = i-1; } if(i==elementCount && loopStatus == "start"){ loopStatus = "end"; i=elementCount-1; } if(i==0 && loopStatus == "end"){ loopStatus = "start"; i=0; } },settings.cycleInterval); }); }, hrzAccordion: function(options) { this.settings = { eventTrigger : "click", containerClass : "container", listItemClass : "listItem", contentContainerClass : "contentContainer", contentWrapper : "contentWrapper", contentInnerWrapper : "contentInnerWrapper", handleClass : "handle", handleClassOver : "handleOver", handleClassSelected : "handleSelected", handlePosition : "right", handlePositionArray : "", // left,left,right,right,right closeEaseAction : "swing", closeSpeed : 500, openEaseAction : "swing", openSpeed : 500, openOnLoad : 2, hashPrefix : "tab", eventAction : function(){ //add your own extra clickAction function here }, completeAction : function(){ //add your own onComplete function here }, closeOpenAnimation : 1,// 1 - open and close at the same time / 2- close all and than open next cycle : false, // not integrated yet, will allow to cycle through tabs by interval cycleInterval : 10000, fixedWidth : "", eventWaitForAnim : true }; if(options){ $.extend(this.settings, options); } var settings = this.settings; return this.each(function(a){ var container = $(this).attr("id") || $(this).attr("class"); $(this).data('settings', settings); $(this).wrap("<div class='"+settings.containerClass+"'></div>"); var elementCount = $('#'+container+' > li, .'+container+' > li').size(); var containerWidth = $("."+settings.containerClass).width(); var handleWidth = $("."+settings.handleClass).css("width"); handleWidth = handleWidth.replace(/px/,""); var finalWidth; var handle; if(settings.fixedWidth){ finalWidth = settings.fixedWidth; }else{ finalWidth = containerWidth-(elementCount*handleWidth)-handleWidth; } $('#'+container+' > li, .'+container+' > li').each(function(i) { $(this).attr('id', container+"ListItem"+i); $(this).attr('class',settings.listItemClass); $(this).html("<div class='"+settings.contentContainerClass+"' id='"+container+"Content"+i+"'>" +"<div class=\""+settings.contentWrapper+"\">" +"<div class=\""+settings.contentInnerWrapper+"\">" +$(this).html() +"</div></div></div>"); if($("div",this).hasClass(settings.handleClass)){ var html = $("div."+settings.handleClass,this).attr("id",""+container+"Handle"+i+"").html(); $("div."+settings.handleClass,this).remove(); handle = "<div class=\""+settings.handleClass+"\" id='"+container+"Handle"+i+"'>"+html+"</div>"; }else{ handle = "<div class=\""+settings.handleClass+"\" id='"+container+"Handle"+i+"'></div>"; } if(settings.handlePositionArray){ splitthis = settings.handlePositionArray.split(","); settings.handlePosition = splitthis[i]; } switch(settings.handlePosition ){ case "left": $(this).prepend( handle ); break; case "right": $(this).append( handle ); break; case "top": $("."+container+"Top").append( handle ); break; case "bottom": $("."+container+"Bottom").append( handle ); break; } $("#"+container+"Handle"+i).bind("mouseover", function(){ $("#"+container+"Handle"+i).addClass(settings.handleClassOver); }); $("#"+container+"Handle"+i).bind("mouseout", function(){ if( $("#"+container+"Handle"+i).attr("rel") != "selected"){ $("#"+container+"Handle"+i).removeClass(settings.handleClassOver); } }); $.hrzAccordion.setOnEvent(i, container, finalWidth, settings); if(i == elementCount-1){ $('#'+container+",."+container).show(); } if(settings.openOnLoad !== false && i == elementCount-1){ var location_hash = location.hash; location_hash = location_hash.replace("#", ""); if(location_hash.search(settings.hashPrefix) != '-1' ){ var tab = 1; location_hash = location_hash.replace(settings.hashPrefix, ""); } if(location_hash && tab ==1){ $("#"+container+"Handle"+(location_hash)).attr("rel",container+"HandleSelected"); $("#"+container+"Content"+(location_hash)).attr("rel",container+"ContainerSelected"); $("#"+container+"Handle"+(location_hash-1)).trigger(settings.eventTrigger); }else{ $("#"+container+"Handle"+(settings.openOnLoad)).attr("rel",container+"HandleSelected"); $("#"+container+"Content"+(settings.openOnLoad)).attr("rel",container+"ContainerSelected"); $("#"+container+"Handle"+(settings.openOnLoad-1)).trigger(settings.eventTrigger); } } }); if(settings.cycle === true){ $(this).hrzAccordionLoop(); } }); } }); })(jQuery); **Given is the code used for the accordion...please check out this Accordion Link. in the link there are four examples of accordions. i want the last accordion i.e example 4 to be vertical ...kindly help me.

    Read the article

  • Smarty Tag help [closed]

    - by ntechi
    I am using an engine, where for forums Vbulletin is used and for Other thiiings social engine 3 is used, This was done by some professionals In one of the page I am having popular tags(In Social Engine) Its too long I want shortened it, How can I do it? here is my code {* SHOW POPULAR TAGS START *} <tr> <td align="left" valign="top"><img src="images/spacer.gif" alt="" width="1" height="10" /></td> </tr> <tr> <td align="left" valign="top"><table width="220" border="0" align="left" cellpadding="0" cellspacing="0"> <tr> <td width="12" align="left" valign="top"><img src="images/blog_belowtl.jpg" alt="" width="12" height="10" /></td> <td width="196" align="left" valign="top" background="images/blog_belowtbg.jpg"><img src="images/spacer.gif" width="1" height="10" /></td> <td width="12" align="right" valign="top"><img src="images/blog_belowtr.jpg" alt="" width="12" height="10" /></td> </tr> <tr> <td align="left" valign="top" background="images/blog_belowlbg.jpg" style="background-repeat: repeat-y;">&nbsp;</td> <td align="left" valign="top"><table width="196" border="0" align="left" cellpadding="0" cellspacing="0"> <tr> <td align="left" valign="top" > {*<div class="articletags" > {foreach from=$popular_tags item=poptag} <a class="tag{$poptag.class}" href="articles.php?tag={$poptag.name}">{$poptag.name}</a> {/foreach} </div>*} {foreach from=$popular_tags item=poptag} {if $poptag.count == '1' } {assign var=cssClass value='tahoma15_cloud'} {elseif $poptag.count == '2' } {assign var=cssClass value='tahoma12bold_cloud'} {elseif $poptag.count == '3'} {assign var=cssClass value='tahoma13bold_cloud'} {elseif $poptag.count == '4'} {assign var=cssClass value='tahoma14bold_cloud'} {elseif $poptag.count == '5'} {assign var=cssClass value='tahoma15_cloud'} {else} {assign var=cssClass value='tahoma18bold_cloud'} {/if} <span class="{$cssClass}"><a href="articles.php?tag={$poptag.name}" class="{$cssClass}">{$poptag.name}</a></span> {/foreach} </td> </tr> </table></td> <td align="left" valign="top" background="images/blog_belowrbg.jpg" style="background-repeat: repeat-y;">&nbsp;</td> </tr> <tr> <td align="left" valign="top"><img src="images/blog_belowbl.jpg" alt="" width="12" height="10" /></td> <td align="left" valign="top" background="images/blog_belowbbg.jpg"><img src="images/spacer.gif" alt="" width="1" height="10" /></td> <td align="right" valign="top"><img src="images/blog_belowbr.jpg" alt="" width="12" height="10" /></td> </tr> </table></td> </tr> {* SHOW POPULAR TAGS END *} You can check the lenght of this tag, on this link http://www.managementparadise.com/articles.php Currently it is displaying very long on the widget area I am new on this, so any help will be appreciated :)

    Read the article

  • Remove/squash entries in a vertical hash

    - by Forkrul Assail
    I have a grid that represents an X, Y matrix, stored as a hash here. Some points on the X Y matrix may have values (as type string), and some may not. A typical grid could look like this: {[9, 5]=>"Alaina", [10, 3]=>"Courtney", [11, 1]=>"Gladys", [8, 7]=>"Alford", [14, 11]=>"Lesley", [17, 2]=>"Lawson", [0, 5]=>"Katrine", [2, 1]=>"Tyra", [3, 3]=>"Fredy", [1, 7]=>"Magnus", [6, 9]=>"Nels", [7, 11]=>"Kylie", [11, 0]=>"Kellen", [10, 2]=>"Johan", [14, 10]=>"Justice", [0, 4]=>"Barton", [2, 0]=>"Charley", [3, 2]=>"Magnolia", [1, 6]=>"Maximo", [7, 10]=>"Olga", [19, 5]=>"Isadore", [16, 3]=>"Delfina", [17, 1]=>"Noe", [20, 11]=>"Francis", [10, 5]=>"Creola", [9, 3]=>"Bulah", [8, 1]=>"Lempi", [11, 7]=>"Raquel", [13, 11]=>"Jace", [1, 5]=>"Garth", [3, 1]=>"Ernest", [2, 3]=>"Malcolm", [0, 7]=>"Alejandrin", [7, 9]=>"Marina", [6, 11]=>"Otilia", [16, 2]=>"Hailey", [20, 10]=>"Brandt", [8, 0]=>"Madeline", [9, 2]=>"Leanne", [13, 10]=>"Jenifer", [1, 4]=>"Humberto", [3, 0]=>"Nicholaus", [2, 2]=>"Nadia", [0, 6]=>"Abigail", [6, 10]=>"Zola", [20, 5]=>"Clementina", [23, 3]=>"Alvah", [19, 11]=>"Wallace", [11, 5]=>"Tracey", [8, 3]=>"Hulda", [9, 1]=>"Jedidiah", [10, 7]=>"Annetta", [12, 11]=>"Nicole", [2, 5]=>"Alison", [0, 1]=>"Wilma", [1, 3]=>"Shana", [3, 7]=>"Judd", [4, 9]=>"Lucio", [5, 11]=>"Hardy", [19, 10]=>"Immanuel", [9, 0]=>"Uriel", [8, 2]=>"Milton", [12, 10]=>"Elody", [5, 10]=>"Alexanne", [1, 2]=>"Lauretta", [0, 0]=>"Louvenia", [2, 4]=>"Adelia", [21, 5]=>"Erling", [18, 11]=>"Corene", [22, 3]=>"Haskell", [11, 11]=>"Leta", [10, 9]=>"Terrence", [14, 1]=>"Giuseppe", [15, 3]=>"Silas", [12, 5]=>"Johnnie", [4, 11]=>"Aurelie", [5, 9]=>"Meggie", [2, 7]=>"Phoebe", [0, 3]=>"Sister", [1, 1]=>"Violet", [3, 5]=>"Lilian", [18, 10]=>"Eusebio", [11, 10]=>"Emma", [15, 2]=>"Theodore", [14, 0]=>"Cassidy", [4, 10]=>"Edmund", [2, 6]=>"Claire", [0, 2]=>"Madisen", [1, 0]=>"Kasey", [3, 4]=>"Elijah", [17, 11]=>"Susana", [20, 1]=>"Nicklaus", [21, 3]=>"Kelsie", [10, 11]=>"Garnett", [11, 9]=>"Emanuel", [15, 1]=>"Louvenia", [14, 3]=>"Otho", [13, 5]=>"Vincenza", [3, 11]=>"Tate", [2, 9]=>"Beau", [5, 7]=>"Jason", [6, 1]=>"Jayde", [7, 3]=>"Lamont", [4, 5]=>"Curt", [17, 10]=>"Mack", [21, 2]=>"Lilyan", [10, 10]=>"Ruthe", [14, 2]=>"Georgianna", [4, 4]=>"Nyasia", [6, 0]=>"Sadie", [16, 11]=>"Emil", [21, 1]=>"Melba", [20, 3]=>"Delia", [3, 10]=>"Rosalee", [2, 8]=>"Myrtle", [7, 2]=>"Rigoberto", [14, 5]=>"Jedidiah", [13, 3]=>"Flavie", [12, 1]=>"Evie", [8, 9]=>"Olaf", [9, 11]=>"Stan", [20, 2]=>"Judge", [5, 5]=>"Cassie", [7, 1]=>"Gracie", [6, 3]=>"Armando", [4, 7]=>"Delia", [3, 9]=>"Marley", [16, 10]=>"Robyn", [2, 11]=>"Richie", [12, 0]=>"Gilberto", [13, 2]=>"Dedrick", [9, 10]=>"Liam", [5, 4]=>"Jabari", [7, 0]=>"Enola", [6, 2]=>"Lela", [3, 8]=>"Jade", [2, 10]=>"Johnson", [15, 5]=>"Willow", [12, 3]=>"Fredrick", [13, 1]=>"Beau", [9, 9]=>"Carlie", [8, 11]=>"Daisha", [6, 5]=>"Declan", [4, 1]=>"Carolina", [5, 3]=>"Cruz", [7, 7]=>"Jaime", [0, 9]=>"Anthony", [1, 11]=>"Esta", [13, 0]=>"Shaina", [12, 2]=>"Alec", [8, 10]=>"Lora", [6, 4]=>"Emely", [4, 0]=>"Rodger", [5, 2]=>"Cedrick", [0, 8]=>"Collin", [1, 10]=>"Armani", [16, 5]=>"Brooks", [19, 3]=>"Eleanora", [18, 1]=>"Alva", [7, 5]=>"Melissa", [5, 1]=>"Tabitha", [4, 3]=>"Aniya", [6, 7]=>"Marc", [1, 9]=>"Marjorie", [0, 11]=>"Arvilla", [19, 2]=>"Adela", [7, 4]=>"Zakary", [5, 0]=>"Emely", [4, 2]=>"Alison", [1, 8]=>"Lorenz", [0, 10]=>"Lisandro", [17, 5]=>"Aylin", [18, 3]=>"Giles", [19, 1]=>"Kyleigh", [8, 5]=>"Mary", [11, 3]=>"Claire", [10, 1]=>"Avis", [9, 7]=>"Manuela", [15, 11]=>"Chesley", [18, 2]=>"Kristopher", [24, 3]=>"Zola", [8, 4]=>"Pietro", [10, 0]=>"Delores", [11, 2]=>"Timmy", [15, 10]=>"Khalil", [18, 5]=>"Trudie", [17, 3]=>"Rafael", [16, 1]=>"Anthony"} What I need to do though, is basically remove all the empty entries. Let's say [17,3] = Raphael does not have an element in front of if (let's say - no [16,3] exists) then [17,3] should become [16,3] etc. So basically all empty items will be popped off the vertical (row) structure of the hash. Are there functions I should have a look at or is there an easy squash-like method that would just remove blanks and adjust and move other items? Thanks in advance for your help.

    Read the article

  • Retrieving saved checkboxes' name and values from database

    - by sermed
    I have a form with checkboxes, each one has a value. When the registered user select any checkbox the value is incremented (the summation) and then then registred user save his selection of checkbox if he satisfied with the result of summation into database all this work fine ...i want to enable the registred user to view his selection history by retriving and displaying the checkboxes he selected in a page with thier values ... How I can do that? I'm just able to save the selected checkboxes as choice 1, choice 2, for example .. I want to view the selected checkboxes that is saved in database as the appear in the page when the user first select them: for example if the registred user selects these 3 options LEAD DEEP KEEL (1825) FULLY BATTENED MAINSAIL (558) TEAK SIDE DECKS (2889) They will be saved as for example (choice1, choice2, choice3). But if he want to view selected checkboxes the appear exactly as first he selects them: LEAD DEEP KEEL (1825) FULLY BATTENED MAINSAIL (558) TEAK SIDE DECKS (2889) This is my user table: $query="CREATE TABLE User( user_id varchar(20), password varchar(40), user_type varchar(20), firstname varchar(30), lastname varchar(30), street varchar(50), city varchar(50), county varchar(50), post_code varchar(10), country varchar(50), gender varchar(6), dob varchar(15), tel_no varchar(50), vals varchar(50), email varchar(50))"; and the code to inser the options selected to database <?php include("databaseconnection.php"); $str = ''; foreach($_POST as $key => $val) if (strpos($key,'choice') !== false) $str .= $key.','; $query = "INSERT INTO User (vals) VALUES('$str')"; $result=mysql_query($query,$conn); if ($result) { (mysql_error(); } else { echo " done"; } ?> And this is my form: function checkTotal() { document.listForm.total.value = ''; var sum = 0; for (i=0;i <form name="listForm" method="post" action="insert_options.php" > <TABLE cellPadding=3 width=600 border=0> <TBODY> <TR> <TH align=left width="87%" bgColor=#b0b3b4><SPAN class=whiteText>Item</SPAN></TH> <TH align=right width="13%" bgColor=#b0b3b4><SPAN class=whiteText>Select</SPAN></TH></TR> <TR> <TD bgcolor="#9da8af"colSpan=2><SPAN class=normalText><B>General</B></SPAN></TD></TR> <TR> <TD bgcolor="#c4c8ca"><SPAN class=normalText >TEAK SIDE DECKS (2889)</SPAN></TD> <TD align=right bgColor=#c4c8ca><input name="choice" value="2889" type="checkbox" onchange="checkTotal()" /></TD></TR> <TR> <TD bgColor=#c4c8ca><SPAN class=normalText>LEAD DEEP KEEL (1825)</SPAN></TD> <TD align=right bgColor=#c4c8ca><input name="choice" value="1825" type="checkbox" onchange="checkTotal()"></TD></TR> <TR> <TD bgColor=#c4c8ca><SPAN class=normalText>FULLY BATTENED MAINSAIL (558)</SPAN></TD> <TD align=right bgColor=#c4c8ca><input name="choice" value="558" type="checkbox" onchange="checkTotal()"></TD></TR> <TR> <TD bgColor=#c4c8ca><SPAN class=normalText>HIGH TECH SAILS FOR CONVENTIONAL RIG (1979)</SPAN></TD> <TD align=right bgColor=#c4c8ca><input name="choice" value="1979" type="checkbox" onchange="checkTotal()"></TD></TR> <TR> <TD bgColor=#c4c8ca><SPAN class=normalText>IN MAST REEFING WITH HIGH TECH SAILS (2539)</SPAN></TD> <TD align=right bgColor=#c4c8ca><input name="choice" value="2539" type="checkbox" onchange="checkTotal()"></TD></TR> <TR> <TD bgColor=#c4c8ca><SPAN class=normalText>SPlNNAKER GEAR (POLE LINES DECK FITTINGS) (820)</SPAN></TD> <TD align=right bgColor=#c4c8ca><input name="choice" value="820" type="checkbox" onchange="checkTotal()"></TD></TR> <TR> <TD bgColor=#c4c8ca><SPAN class=normalText>SPINNAKER POLE VERTICAL STOWAGE SYSTEM (214)</SPAN></TD> <TD align=right bgColor=#c4c8ca><input name="choice" value="214" type="checkbox" onchange="checkTotal()"></TD></TR> <TR> <TD bgColor=#c4c8ca><SPAN class=normalText>GAS ROD KICKER (208)</SPAN></TD> <TD align=right bgColor=#c4c8ca><input name="choice" value="208" type="checkbox" onchange="checkTotal()"></TD></TR> <TR> <TD bgColor=#c4c8ca><SPAN class=normalText>SIDE RAIL OPENINGS (BOTH SIDES) (392)</SPAN></TD> <TD align=right bgColor=#c4c8ca><input name="choice" value="392" type="checkbox" onchange="checkTotal()"></TD></TR> <TR> <TD bgColor=#c4c8ca><SPAN class=normalText>SPRING CLEATS MIDSHIPS -ALUMIMIUM (148)</SPAN></TD> <TD align=right bgColor=#c4c8ca><input name="choice" value="148" type="checkbox" onchange="checkTotal()"></TD></TR> <TR> <TD bgColor=#c4c8ca><SPAN class=normalText>ELECTRIC ANCHOR WINDLASS (1189)</SPAN></TD> <TD align=right bgColor=#c4c8ca><input name="choice" value="1189" type="checkbox" onchange="checkTotal()"> </TD></TR> <TR> <TD bgColor=#c4c8ca><SPAN class=normalText>ANCHOR CHAIN GALVANISED (50m) (202)</SPAN></TD> <TD align=right bgColor=#c4c8ca><input name="choice" value="202" type="checkbox" onchange="checkTotal()"> </TD></TR> <TR> <TD bgColor=#c4c8ca><SPAN class=normalText>ANCHOR CHAIN GALVANISED (50m) (1141)</SPAN></TD> <TD align=right bgColor=#c4c8ca><input name="choice" value="1141" type="checkbox" onchange="checkTotal()"></TD></TR> <TR> <TD bgcolor="#9da8af"colSpan=2><SPAN class=normalText><B>NAVIGATION & ELECTRONICS</B></SPAN></TD></TR> <TR> <TD bgcolor="#c4c8ca"><SPAN class=normalText >WIND VANE (STAINLESS STEEL)(41)</SPAN></TD> <TD align=right bgColor=#c4c8ca><input name="choice" value="41" type="checkbox" onchange="checkTotal()" /></TD></TR> <TR> <TD bgColor=#c4c8ca><SPAN class=normalText>RAYMARINE ST6O LOG & DEPTH (SEPARATE UNITS)(226)</SPAN></TD> <TD align=right bgColor=#c4c8ca><input name="choice" value="226" type="checkbox" onchange="checkTotal()"></TD></TR> <TR> <TD bgcolor="#9da8af"colSpan=2><SPAN class=normalText><B>ENGINES & ELECTRICS</B></SPAN></TD></TR> <TR> <TD bgColor=#c4c8ca><SPAN class=normalText>SHORE SUPPLY (220V) WITH 3 OUTLETS (EXCLUDJNG SHORE CABLE) (327)</SPAN></TD> <TD align=right bgColor=#c4c8ca><input name="choice" value="327" type="checkbox" onchange="checkTotal()"></TD></TR> <TR> <TD bgColor=#c4c8ca><SPAN class=normalText>3rd BATTERY(14OA/H)(196)</SPAN></TD> <TD align=right bgColor=#c4c8ca><input name="choice" value="196" type="checkbox" onchange="checkTotal()"></TD></TR> <TD bgColor=#c4c8ca><SPAN class=normalText>24 AMP BATTERY CHARGER (475)</SPAN></TD> <TD align=right bgColor=#c4c8ca><input name="choice" value="475" type="checkbox" onchange="checkTotal()"></TD></TR> <TD bgColor=#c4c8ca><SPAN class=normalText>2 BLADED FOLDING PROPELLER (UPGRADE)(299)</SPAN></TD> <TD align=right bgColor=#c4c8ca><input name="choice" value="299" type="checkbox" onchange="checkTotal()"></TD></TR> <TR> <TD bgcolor="#9da8af"colSpan=2><SPAN class=normalText><B>BELOW DECKS/DOMESTIC</B></SPAN></TD></TR> <TD bgColor=#c4c8ca><SPAN class=normalText>WARM WATER (FROM ENGINE & 220V)(749)</SPAN></TD> <TD align=right bgColor=#c4c8ca><input name="choice" value="749" type="checkbox" onchange="checkTotal()"></TD></TR> <TD bgColor=#c4c8ca><SPAN class=normalText>SHOWER IN AFT HEADS WITH PUMPOUT(446)</SPAN></TD> <TD align=right bgColor=#c4c8ca><input name="choice" value="446" type="checkbox" onchange="checkTotal()"></TD></TR> <TD bgColor=#c4c8ca><SPAN class=normalText>DECK SUCTION DISPOSAL FOR HOLDINGTANK(166)</SPAN></TD> <TD align=right bgColor=#c4c8ca><input name="choice" value="166" type="checkbox" onchange="checkTotal()"></TD></TR> <TD bgColor=#c4c8ca><SPAN class=normalText>REFRIGERATED COOLBOX (12V)(666)</SPAN></TD> <TD align=right bgColor=#c4c8ca><input name="choice" value="666" type="checkbox" onchange="checkTotal()"></TD></TR> <TD bgColor=#c4c8ca><SPAN class=normalText>LFS SAFETY PACKAGE (COCKPIT HARNESS POINTS STAINLESS STEEL JACKSTAYS)(208)</SPAN></TD> <TD align=right bgColor=#c4c8ca><input name="choice" value="208" type="checkbox" onchange="checkTotal()"></TD></TR> <TD bgColor=#c4c8ca><SPAN class=normalText>UPHOLSTERY UPGRADE IN SALOON (SUEDETYPE)(701)</SPAN></TD> <TD align=right bgColor=#c4c8ca><input name="choice" value="701" type="checkbox" onchange="checkTotal()"></TD></TR> <TR> <TD bgcolor="#9da8af"colSpan=2><SPAN class=normalText><B>NAVIGATION ELECTRONICS & ELECTRICS</B></SPAN></TD></TR> <TD bgColor=#c4c8ca><SPAN class=normalText>VHF RADIO AERIAL CABLED TO NAVIGATION AREA(178)</SPAN></TD> <TD align=right bgColor=#c4c8ca><input name="choice" value="178" type="checkbox" onchange="checkTotal()"></TD></TR> </table>

    Read the article

  • How can I do vertical paging with UITableView?

    - by vodkhang
    Let me describe the situation I am trying to do: I have a list of Items. When I go into ItemDetailView, which is a UITableView. I want to do paging here like: When I scroll down out of the table view, I want to display the next item. Like in Good Reader: Currently, I am trying 2 approaches but both do not really work for me. 1st: I let my UITableView over my scroll view and I have a nice animation and works quite ok except sometimes, the UITableView will receive event instead of my scroll view. And because, a UITableView is already a UITableView, this approach seems not be a good idea. Here is some code: - (void)applicationDidFinishLaunching:(UIApplication *)application { // a page is the width of the scroll view scrollView.pagingEnabled = YES; scrollView.contentSize = CGSizeMake(scrollView.frame.size.width, scrollView.frame.size.height * kNumberOfPages); scrollView.showsHorizontalScrollIndicator = NO; scrollView.showsVerticalScrollIndicator = YES; scrollView.scrollsToTop = NO; scrollView.delegate = self; [self loadScrollViewWithPage:0]; } - (void)loadScrollViewWithPage:(int)page { if (page < 0) return; if (page >= kNumberOfPages) return; [self.currentViewController.view removeFromSuperview]; self.currentViewController = [[[MyNewTableView alloc]initWithPageNumber:page] autorelease]; if (nil == currentViewController.view.superview) { CGRect frame = scrollView.frame; [scrollView addSubview:currentViewController.view]; } } - (void)scrollViewDidScroll:(UIScrollView *)sender { if (pageControlUsed) { return; } CGFloat pageHeight = scrollView.frame.size.height; int page = floor((scrollView.contentOffset.y - pageHeight / 2) / pageHeight) + 1; [self loadScrollViewWithPage:page]; } - (IBAction)changePage:(id)sender { int page = pageControl.currentPage; [self loadScrollViewWithPage:page]; // update the scroll view to the appropriate page CGRect frame = scrollView.frame; [scrollView scrollRectToVisible:frame animated:YES]; pageControlUsed = YES; } My second approach is: using pop and push of navigationController to pop the current ItemDetail and push a new one on top of it. But this approach will not give me a nice animation of scrolling down like the first approach. So, the answer to how I can get it done with either approach will be appreciated

    Read the article

  • vertical scrolling of text in UItextfield

    - by mindfreak
    I am filling Uitextfield with Uibutton click event.(e.g. clicking on BUTTONA will add 'a' to textfield.). my problem is that when inserted text reaches the end of textfield, further characters inserted into textfield via UIbutton are not visible.instead ... is seen . how to let text inside Uitextfield scroll to left when width of UItextfield is reached(just like when we enter characters in UItextfield via keyboard) ? Please let me know.

    Read the article

  • ExtJS: Autoscroll vertical FormPanels added to panel

    - by Sarge
    Hi All, I'm writing an app where I have a BorderLayout for the entire page. In the south part I have a Panel to which I add FormPanels. I would like to be able to scroll that Panel so I can scroll through the FormPanels. So far, nothing I've found from searches has helped. I don't quite understand what ExtJS requires in terms of the combination of LayoutManagers, setting the size and setting AutoScroll. Any partial tips will be gratefully followed up. A code snippet: createTrailJunctionPanel = function(trailJunction) { var trailJunctionPanel = new Ext.form.FormPanel({ labelWidth: 75, width: 350, defaultType: 'textfield', items: [{ fieldLabel: 'Junction Name', name: 'junction-name' }], autoScroll:true, //anchor: '100% 100%', height: 100 }); matchedTrailJunctionsPanel.add(trailJunctionPanel); if(trailJunction.publicTrailSegments.length == 0) { matchedTrailJunctionsPanel.add(new Ext.form.Label({text: 'No public trails matched'})); } else { var grid = new Ext.grid.GridPanel({ store: mapMatchObjectStore, columns: [ {id:'publicTrailSegment',header: 'Trail', width: 160, sortable: true, dataIndex: 'publicTrailSegment'} ], stripeRows: true, autoExpandColumn: 'publicTrailSegment', height: 350, width: 600, title: 'Matched Trail Junctions' }); matchedTrailJunctionsPanel.add(grid); } matchedTrailJunctionsPanel.doLayout(); } matchedTrailJunctionsPanel = new Ext.Panel({ title: "Matched Trail Junctions2", id: "matched-trail-junctions", autoScroll:true //layout: 'anchor' });

    Read the article

  • iPhone Device 3.1 SDK Breaks vertical alignment of UITableViewCellStyleValue1 textLabel

    - by user171089
    Can anyone provide an explanation for the following phenomenon? As of the iPhone Device 3.1 SDK, I've found that if a UITableViewCell is of style UITableViewCellStyleValue1 and its detailTextLabel.text is unassigned, then the textLabel does not display in the center of the cell as would be expected. One notable caveat is that this only happens for me when I'm testing on the Device – the iPhone Simulator 3.1 SDK displays the cells correctly. Also, this is not a problem when using the iPhone Device 3.0 SDK. Below is a simple UITableView subclass implementation that demonstrates the problem. @implementation BuggyTableViewController #pragma mark Table view methods // Customize the number of rows in the table view. - (NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section { return 3; } // Customize the appearance of table view cells. - (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath { static NSString *CellIdentifier = @"Cell"; UITableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:CellIdentifier]; if (cell == nil) { cell = [[[UITableViewCell alloc] initWithStyle:UITableViewCellStyleValue1 reuseIdentifier:CellIdentifier] autorelease]; } switch (indexPath.row) { case 0: cell.textLabel.text = @"detailTextLabel.text unassigned"; break; case 1: cell.textLabel.text = @"detailTextLabel.text = @\"\""; cell.detailTextLabel.text = @""; break; case 2: cell.textLabel.text = @"detailTextLabel.text = @\"A\""; cell.detailTextLabel.text = @"A"; break; default: break; } return cell; } @end

    Read the article

  • jquery find image based on "align"

    - by SoulieBaby
    Hi all, I'm trying to find all the images on a page based on their alignment (no class or id attached to these images), although I'm not sure how to do it. Basically I want to add CSS to images which are aligned to the right, yet leave the other images as they are. If anyone could help out, that'd be great :)

    Read the article

  • Horizontal menu vertical padding on anchor tag doesn't take affect

    - by Levi
    I am wondering why in the following example the top and bottom padding has no affect on the anchor tag while the left and right does? <ul id="nav"> <li><a href="#">One</a></li> <li><a href="#">Two</a></li> <li><a href="#">Three</a></li> <li><a href="#">Four</a></li> <li><a href="#">Five</a></li> </ul> #nav{ list-style:none; } #nav li{ border:1px solid #666; display:inline; /*If you do it this way you need to set the top and bottom padding to be the same here as under #nav li a padding:8px 0; */ } #nav li a{ padding:8px 16px; } Example: Link So my main question is, why does the top and bottom padding not have an effect on the list items while the left and right do? I did try this out with a float instead of a display:inline on the list item and it worked as I expected it to. So I guess if I had a secondary question it would be what is the difference between a float:left; and a display:inline? I was reading the float spec and it sounds like a float is still a box online inline so somewhat like inline-block? I appreciate any input, this isn't really something I need to know to finish a project or anything, but I would like to know why. Thanks Levi

    Read the article

  • latex tabular vertical alignment to top?

    - by shoosh
    I'm trying to create a simple tabular with two cells of text and two images below them like so: \begin{tabular}[h]{ c | c} \emph{Normal} & \emph{Cone} \\ \includegraphics[width=0.39\textwidth]{images/pipe1} & \includegraphics[width=0.61\textwidth]{images/pipe2} \end{tabular} The first image is shorter than the second and I want it to be aligned at the top of the cell but for some reason it gets aligned to the bottom of the cell instead. I've tried using the array package and do this: \begin{tabular}[h]{ p{0.39\textwidth} | p{0.61\textwidth} } \emph{Normal} & \emph{Cone} \\ \includegraphics[width=0.39\textwidth]{images/pipe1} & \includegraphics[width=0.61\textwidth]{images/pipe2} \end{tabular} But this doesn't change anything. The first image is still aligned to the bottom. Why is that? Could there be something else going on which forces the alignment to stick to the bottom?

    Read the article

facebook twitter digg google delicious technorati stumbleupon myspace wordpress linkedin gmail igoogle windows live tumblr viadeo yahoo buzz yahoo mail yahoo bookmarks favorites email print

< Previous Page | 8 9 10 11 12 13 14 15 16 17 18 19  | Next Page >