Jump to content

newcoder1010

Members
  • Content count

    349
  • Joined

  • Last visited

  • Days Won

    2

newcoder1010 last won the day on September 3 2016

newcoder1010 had the most liked content!

Community Reputation

3 Neutral

About newcoder1010

  • Rank
    Member

Recent Profile Visitors

15,008 profile views
  1. Expand and collapse does not work completely

    If I put accordion outside column class, it works within the column. But I need to be able to do it in both column. That means it allows me to expand two elements at once. One element from each column. I guess it is because each column has its own parent. How can I have same parent for both columns so two columns can have most one element expanded?
  2. Expand and collapse does not work completely

    I tried this but did not work. I am trying to put them in two columns. Only one can be expanded at once but multiple being expanded. Can you please provide me a sample code to do it? <!DOCTYPE html> <html> <head> <meta name="viewport" content="width=device-width, initial-scale=1"> <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css"> <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script> <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script> </head> <body> <div class="container"> <h2>Accordion Example</h2> <p><strong>Note:</strong> The <strong>data-parent</strong> attribute makes sure that all collapsible elements under the specified parent will be closed when one of the collapsible item is shown.</p> <div class="panel-group" id="accordion1"> <div class = "col-lg-6 col-md-6"> <div class="panel panel-default"> <div class="panel-heading"> <h4 class="panel-title"> <a data-toggle="collapse" data-parent="#accordion1" href="#collapse1">Collapsible Group 1</a> </h4> </div> <div id="collapse1" class="panel-collapse collapse "> <div class="panel-body">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</div> </div> </div> <div class="panel panel-default"> <div class="panel-heading"> <h4 class="panel-title"> <a data-toggle="collapse" data-parent="#accordion1" href="#collapse2">Collapsible Group 2</a> </h4> </div> <div id="collapse2" class="panel-collapse collapse"> <div class="panel-body">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</div> </div> </div> </div> </div> <div class="panel-group" id="accordion2"> <div class = "col-lg-6 col-md-6"> <div class="panel panel-default"> <div class="panel-heading"> <h4 class="panel-title"> <a data-toggle="collapse" data-parent="#accordion2" href="#collapse3">Collapsible Group 3</a> </h4> </div> <div id="collapse3" class="panel-collapse collapse "> <div class="panel-body">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</div> </div> </div> <div class="panel panel-default"> <div class="panel-heading"> <h4 class="panel-title"> <a data-toggle="collapse" data-parent="#accordion2" href="#collapse4">Collapsible Group 4</a> </h4> </div> <div id="collapse4" class="panel-collapse collapse"> <div class="panel-body">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</div> </div> </div> </div> </div> </div> </body> </html>
  3. Expand and collapse does not work completely

    I will try it. I am trying to create questions and answers which can be expandable and collapsible. Is there better way to do it? Thanks.
  4. Expand and collapse does not work completely

    Hello, I have two columns using bootstrap classes. I have 5 element each column. Left column expands collapse just fine. That means only one element can be expanded at once. But right column, it allows multiple elements to be expanded at once. How can I allow only one element to be expanded at once for all the elements? Thanks. https://www.w3schools.com/bootstrap/bootstrap_collapse.asp <h2>Accordion Example</h2> <p><strong>Note:</strong> The <strong>data-parent</strong> attribute makes sure that all collapsible elements under the specified parent will be closed when one of the collapsible item is shown.</p> <div class = "col-lg-6 col-md-6 col-sm-6 col-xs-12"> <div class="panel-group" id="accordion"> <div class="panel panel-default"> <div class="panel-heading"> <h4 class="panel-title"> <a data-toggle="collapse" data-parent="#accordion" href="#collapse1">Collapsible Group 1</a> </h4> </div> <div id="collapse1" class="panel-collapse collapse "> <div class="panel-body">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</div> </div> </div> <div class="panel panel-default"> <div class="panel-heading"> <h4 class="panel-title"> <a data-toggle="collapse" data-parent="#accordion" href="#collapse2">Collapsible Group 2</a> </h4> </div> <div id="collapse2" class="panel-collapse collapse"> <div class="panel-body">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</div> </div> </div> <div class="panel panel-default"> <div class="panel-heading"> <h4 class="panel-title"> <a data-toggle="collapse" data-parent="#accordion" href="#collapse3">Collapsible Group 3</a> </h4> </div> <div id="collapse3" class="panel-collapse collapse"> <div class="panel-body">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</div> </div> </div> <div class="panel panel-default"> <div class="panel-heading"> <h4 class="panel-title"> <a data-toggle="collapse" data-parent="#accordion" href="#collapse4">Collapsible Group 4</a> </h4> </div> <div id="collapse4" class="panel-collapse collapse"> <div class="panel-body">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</div> </div> </div> <div class="panel panel-default"> <div class="panel-heading"> <h4 class="panel-title"> <a data-toggle="collapse" data-parent="#accordion" href="#collapse5">Collapsible Group 5</a> </h4> </div> <div id="collapse5" class="panel-collapse collapse"> <div class="panel-body">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</div> </div> </div> </div> </div> <div class = "col-lg-6 col-md-6 col-sm-6 col-xs-12"> <div class="panel-group" id="accordion"> <div class="panel panel-default"> <div class="panel-heading"> <h4 class="panel-title"> <a data-toggle="collapse" data-parent="#accordion" href="#collapse6">Collapsible Group 6</a> </h4> </div> <div id="collapse6" class="panel-collapse collapse "> <div class="panel-body">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</div> </div> </div> <div class="panel panel-default"> <div class="panel-heading"> <h4 class="panel-title"> <a data-toggle="collapse" data-parent="#accordion" href="#collapse7">Collapsible Group 7</a> </h4> </div> <div id="collapse7" class="panel-collapse collapse"> <div class="panel-body">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</div> </div> </div> <div class="panel panel-default"> <div class="panel-heading"> <h4 class="panel-title"> <a data-toggle="collapse" data-parent="#accordion" href="#collapse8">Collapsible Group 8</a> </h4> </div> <div id="collapse8" class="panel-collapse collapse"> <div class="panel-body">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</div> </div> </div> <div class="panel panel-default"> <div class="panel-heading"> <h4 class="panel-title"> <a data-toggle="collapse" data-parent="#accordion" href="#collapse9">Collapsible Group 9</a> </h4> </div> <div id="collapse9" class="panel-collapse collapse"> <div class="panel-body">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</div> </div> </div> <div class="panel panel-default"> <div class="panel-heading"> <h4 class="panel-title"> <a data-toggle="collapse" data-parent="#accordion" href="#collapse10">Collapsible Group 10</a> </h4> </div> <div id="collapse10" class="panel-collapse collapse"> <div class="panel-body">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</div> </div> </div> </div> </div>
  5. How can I vertically align to top?

    Hi, <div class="field field-name-field-step-no field-type-text field-label-hidden"> <div class="field-items"><div class="field-item even">1</div></div></div> .field-name-field-step-no { font-weight: bold; font-size: 46px; padding: 0; vertical-align: top; } https://drive.google.com/open?id=0B7xIEuVi005ydnFBUVJmY2hQRFk I still see some on top of the element. How can I vertically align to top?
  6. How to have an inline form centered and responsive

    Thanks. It worked now.
  7. Hello, I would like to have a responsive inline form. Form only has header, a text field and submit button. Form should be centered in every device. <section id="block-webform-client-block-66" class="block block-webform bnh contextual-links-region clearfix"> <h2 class="block-title">Get Your Offer NOW!</h2> <form class="webform-client-form webform-client-form-66" action="/" method="post" id="webform-client-form-66" accept-charset="UTF-8"> <div> <div class="form-item webform-component webform-component-markup webform-component--get-your-fair-cash-offer-now form-group form-item form-type-markup form-group"> <h2>Enter Address NOW!</h2> </div> <div class="form-item webform-component webform-component-textfield webform-component--property-address form-group form-item form-item-submitted-property-address form-type-textfield form-group"> <input required="required" placeholder="Property Address" class="form-control form-text required" type="text" id="edit-submitted-property-address--2" name="submitted[property_address]" value="" size="60" maxlength="128"> <label class="control-label element-invisible" for="edit-submitted-property-address--2">Property Address <span class="form-required" title="This field is required.">*</span></label> </div> <input type="hidden" name="details[sid]"> <div class="form-actions"><button class="webform-submit button-primary btn btn-default form-submit" type="submit" name="op" value="Get Your Offer">Get Your Offer</button> </div> </div> </form> </section> #block-webform-client-block-66{ background: bisque; padding: 0; margin: 0; text-align: center; } .webform-client-form-66 { display: block; text-align: center; } .webform-client-form-66 .webform-component--property-address { margin-top: 0px; /* display: inline; */ margin-top: 0; text-align: center; margin-bottom: 33px; float: left; } .webform-client-form-66 .form-actions { clear: none; margin-top: 0; float: left; margin-left: 40px; } Now the header is centered but the form floated to left. I tried to make the form 50%width and then margin:auto. Then it works somewhat. Please advise how to place the form centered and responsive.
  8. Not able to see complete top bar in mobile phone when I scroll down

    I tried with top:0; but did not work.
  9. Hello, I have a region where I placed a phone block. When I visit the page on mobile browser, it looks just fine. As soon as I start scrolling down, I do not see the complete block. About 20 % on the top gets truncated when I scroll down. When I scroll back up, it looks normal. Please see the image for details. Please advise. https://drive.google.com/open?id=0B7xIEuVi005yUjYwNkw3UTB5ME0 Thanks.
  10. How to inspect mobile browsers

    Thank you. It helped.
  11. How to inspect mobile browsers

    Hello, I am seeing some styling issues on my mobile browsers. When I make the laptop's browsers screen sizes same as mobile, I do not see the same issue. So, I am thinking to inspect the elements on my phone and see if I can fix it. How can I inspect the mobile browsers? Thanks.
  12. Fixed position does not work on my phone

    Update - The block I placed it at the header. So when I scroll down i do not see the block at all. I started seeing it fixed position only when I scroll back up. If you can provide any input, it would be great. But in laptop browser, block is always in fixed position.
  13. Fixed position does not work on my phone

    Hello, I have a phone number block. I applied the below css to have the phone number fixed. It works on my laptop when I make the screen less than 768px. However, when I visit the page on my galaxy phone, that phone no block not fixed. .PhoneNo { position: fixed; z-index: 2; } I have done that many times. I am not sure why it would not work now. Please advise.
  14. Set ExcelObj = createobject("excel.application") ExcelObj.Visible = true Set ExcelConfigFile = ExcelObj.Workbooks.Open (Path) Set Sheet = ExcelConfigFile.Worksheets("Scripts") TotalRow = Sheet.UsedRange.Rows.Count Hello, So far, I get total number of row of the sheet. I have a column called "key". How can I count total number of rows in the key column? Thanks.
  15. Hi, Every time I create an order I get a confirmation page with the below information. I need to be able to write a function which will return the data I am looking for. How can I write a Function that returns specific data? Data I get after submission: "Student ID: 100 Class ID: 99990444 Teacher ID: 610728" Function Should return "Student ID: 100" after I request for student id. Calling funciton: str = "Student ID: 100 Class ID: 99990444 Teacher ID: 610728" myStudentID = CallFunction(str, "Student ID", "") myClass = CallFunction(str, "Class ID", "") Function CallFunction(completeString, startSearch, endSearch) startPos = InStr(1,completeString,startSearch) CallFunction = mid(CompleteString,startPos,endSearch) End Function Note: Number of digits are unknown for each ID. Also, there is a space after each ID. Above function will not work. I am having trouble how to write the function. Please advise.
×