Jump to content

techker

Members
 View Profile  See their activity

  • Posts

    812

  • Joined

  • Last visited

 Content Type 

Posts posted by techker

    pull hours and grey out time block?

    in MySQL Help

    Posted

    hey guys i wan't to make a type of booking calendar and was wondering what to look for in tutorial or examples?

     

    i want to pull time slots from mysql lets say :10 to 3pm working with dan

     

    so on the visual side i would like to make a time grid and grey out the time slots..

     

    thx

    Accordion fix?

    in CSS Help

    Posted

    Hey guys i got this friend that has a dealership for used cars..so i did him a web site and his wife really wanted an accordion style view.....

     

    so i got it going it works great but buggy..is there a way to fix when you click it goes back to the top of the page?

     

    here is the link maybe it will be easier to understand when you view it.

     

    http://autosspeedy.ca/TEMP/

     

     

    code css:

     

     
.wrapper{
width: 95%;
background-color: #FFF;
padding-left: 15px;
height:100%;
}
.wrapperleft{
width: 100%;
 
background-color: #FFF;
 
 
}
 
.st-accordion{
    width:100%;
hight:100%;
    
    margin: 0 auto;
}
.st-accordion ul li{
    height: 180px;
    border-bottom: 1px solid #c7deef;
    border-top:1px solid #fff;
    overflow: hidden;
}
.st-accordion ul li:first-child{
border-top: none;
color: #000;
}
.st-accordion ul li > a{
    font-family: 'Josefin Slab',Georgia, serif;
    text-shadow: 1px 1px 1px #ccc;
    font-size: 36px;
    display: block;
position: relative;
    line-height: 100px;
outline:none;
    -webkit-transition:  color 0.2s ease-in-out;
-moz-transition:  color 0.2s ease-in-out;
-o-transition:  color 0.2s ease-in-out;
-ms-transition:  color 0.2s ease-in-out;
transition:  color 0.2s ease-in-out;
}
.st-accordion ul li > a span{
background: transparent url(../images/down.png) no-repeat center center;
text-indent:-9000px;
width: 26px;
height: 14px;
position: absolute;
top: 50%;
right: -26px;
margin-top: -7px;
opacity:0;
-webkit-transition:  all 0.2s ease-in-out;
-moz-transition:  all 0.2s ease-in-out;
-o-transition:  all 0.2s ease-in-out;
-ms-transition:  all 0.2s ease-in-out;
transition:  all 0.2s ease-in-out;
font-style:normal;
 
}
.st-accordion ul li > a:hover{
    color: #1693eb;
}
.st-accordion ul li > a:hover span{
opacity:1;
right: 10px;
}
.st-accordion ul li.st-open > a{
    color: #1693eb;
}
.st-accordion ul li.st-open > a span{
-webkit-transform:rotate(180deg);
-moz-transform:rotate(180deg);
    transform:rotate(180deg);
right:10px;
opacity:1;
}
.st-content{
    padding: 5px 0px 30px 0px;
}
.st-content p{
    font-size:  16px;
    font-family:  Georgia, serif;
    font-style: italic;
    line-height:  28px;
    padding: 0px 4px 15px 4px;
color:#333 ;
}
.st-content img{
    width:125px;
    border-right:1px solid #fff;
    border-bottom:1px solid #fff;
}
@media screen and (max-width: 320px){
.st-accordion ul li > a{
font-size:36px;
}
}

    odd/even colors

    in CSS Help

    Posted

    but you see where im confused is that i have no table?it's all css..the only table i have is when i expand the accordion to see the content.but that part don't need any colours..

     

     

    its the <div class="va-slice va-slice-1"> that should be on odd change colours..

    odd/even colors

    in CSS Help

    Posted · Edited by techker

    Hey guys i have a script that has accordian content but i would like it to have odd and even colors?

     

    Dj2sFUc.jpg

    <div id="va-accordion" class="va-container">
              
<div class="va-wrapper">
               
               <?php while($info = mysql_fetch_array($result)){?>
<div class="va-slice va-slice-1">
                    <table width="100%" border="0" cellspacing="0" cellpadding="0">
  <tr>
    <td rowspan="2" valign="top"><img src="images/recent3.jpg" width="160" height="140" ></td>
    <td valign="top">  <h3 class="va-title">  <? echo $info['Make'] ?> <? echo $info['Model'] ?> <? echo $info['Year'] ?></h3></td>
  </tr>
  <tr>
    <td valign="top"> </td>
  </tr>
                    </table>
<div class="va-content">
<p><div class="bubble"><? echo $info['Retail_price']?>$</p>
                            <? echo "<span class='echo_short'>".$info['Description_short_FR']."</span>"; ?>
                            <table width="100%" border="0" cellspacing="0" cellpadding="0">
  <tr>
    <td width="16%"><img src="images/recent3.jpg" width="126" height="120" ></td>
    <td width="84%"><img src="images/recent3.jpg" width="126" height="120" ></td>
  </tr>
</table>
</div>          
</div>
</div> 
        <? } ?> 
        
          </div></div>

    i tried:

     

     

     
.odd{
 color:red;  
}
 
.even{
 color:blue;   
}
 
 

<script type="text/javascript">
$(function(){
    $(".va-slice div.post:odd").addClass('odd'); 
    $(".va-slice div.post:even").addClass('even'); 
    
});
</script>

    javascript window pop up..

    in Javascript Help

    Posted

    hey guys i did a popup window

     

     

    <a class="more" href="javascript:window.open('More.php?ID=<? echo $info['ID'] ?>','MoreInfo','width=700,height=500')">

     

    in chrome works great!

     

    but in IE11 the pop up works but on the parent page i get [object] on white page...

     

    need to press back to go back to main page....

     

    why is that?

    IE compatible..

    in Javascript Help

    Posted

    thx for the reply, wasn't waiting for code just advise..

     

    i updated to the latest jquery.

     

    but also noticed the bootstrap.carousel.js  on the site says

     

    Transition animations not supported in Internet Explorer 8 & 9

    Bootstrap exclusively uses CSS3 for its animations, but Internet Explorer 8 & 9 don't support the necessary CSS properties. Thus, there are no slide transition animations when using these browsers. We have intentionally decided not to include jQuery-based fallbacks for the transitions.

     

     

    so i guess i will change my code...lol what would be more compatible?Ajax?

    IE compatible..

    in Javascript Help

    Posted

    Hey guys im still having this nerver ending struggle between IE .Chrome,Firefox.......Compatibility...

     

    so i have this carrousel on my set and it works great in all browsers but IE....

     

    is there a way to make it work correctly?it goes right but doesnt come back to first page...

     

     

     

    js

     

     
    !function ($) {
     
      "use strict"; // jshint ;_;
     
     
     /* CAROUSEL CLASS DEFINITION
      * ========================= */
     
      var Carousel = function (element, options) {
        this.$element = $(element)
        this.options = options
        this.options.slide && this.slide(this.options.slide)
        this.options.pause == 'hover' && this.$element
          .on('mouseenter', $.proxy(this.pause, this))
          .on('mouseleave', $.proxy(this.cycle, this))
      }
     
      Carousel.prototype = {
     
        cycle: function (e) {
          if (!e) this.paused = false
          this.options.interval
            && !this.paused
            && (this.interval = setInterval($.proxy(this.next, this), this.options.interval))
          return this
        }
     
      , to: function (pos) {
          var $active = this.$element.find('.active')
            , children = $active.parent().children()
            , activePos = children.index($active)
            , that = this
     
          if (pos > (children.length - 1) || pos < 0) return
     
          if (this.sliding) {
            return this.$element.one('slid', function () {
              that.to(pos)
            })
          }
     
          if (activePos == pos) {
            return this.pause().cycle()
          }
     
          return this.slide(pos > activePos ? 'next' : 'prev', $(children[pos]))
        }
     
      , pause: function (e) {
          if (!e) this.paused = true
          clearInterval(this.interval)
          this.interval = null
          return this
        }
     
      , next: function () {
          if (this.sliding) return
          return this.slide('next')
        }
     
      , prev: function () {
          if (this.sliding) return
          return this.slide('prev')
        }
     
      , slide: function (type, next) {
          var $active = this.$element.find('.active')
            , $next = next || $active[type]()
            , isCycling = this.interval
            , direction = type == 'next' ? 'left' : 'right'
            , fallback  = type == 'next' ? 'first' : 'last'
            , that = this
            , e = $.Event('slide')
     
          this.sliding = true
     
          isCycling && this.pause()
     
          $next = $next.length ? $next : this.$element.find('.item')[fallback]()
     
          if ($next.hasClass('active')) return
     
          if ($.support.transition && this.$element.hasClass('slide')) {
            this.$element.trigger(e)
            if (e.isDefaultPrevented()) return
            $next.addClass(type)
            $next[0].offsetWidth // force reflow
            $active.addClass(direction)
            $next.addClass(direction)
            this.$element.one($.support.transition.end, function () {
              $next.removeClass([type, direction].join(' ')).addClass('active')
              $active.removeClass(['active', direction].join(' '))
              that.sliding = false
              setTimeout(function () { that.$element.trigger('slid') }, 0)
            })
          } else {
            this.$element.trigger(e)
            if (e.isDefaultPrevented()) return
            $active.removeClass('active')
            $next.addClass('active')
            this.sliding = false
            this.$element.trigger('slid')
          }
     
          isCycling && this.cycle()
     
          return this
        }
     
      }
     
     
     /* CAROUSEL PLUGIN DEFINITION
      * ========================== */
     
      $.fn.carousel = function (option) {
        return this.each(function () {
          var $this = $(this)
            , data = $this.data('carousel')
            , options = $.extend({}, $.fn.carousel.defaults, typeof option == 'object' && option)
          if (!data) $this.data('carousel', (data = new Carousel(this, options)))
          if (typeof option == 'number') data.to(option)
          else if (typeof option == 'string' || (option = options.slide)) data[option]()
          else if (options.interval) data.cycle()
        })
      }
     
      $.fn.carousel.defaults = {
        interval: 5000
      , pause: 'hover'
      }
     
      $.fn.carousel.Constructor = Carousel
     
     
     /* CAROUSEL DATA-API
      * ================= */
     
      $(function () {
        $('body').on('click.carousel.data-api', '[data-slide]', function ( e ) {
          var $this = $(this), href
            , $target = $($this.attr('data-target') || (href = $this.attr('href')) && href.replace(/.*(?=#[^\s]+$)/, '')) //strip for ie7
            , options = !$target.data('modal') && $.extend({}, $target.data(), $this.data())
          $target.carousel(options)
          e.preventDefault()
        })
      })
     
    }(window.jQuery);
     
     
     
    DIV
     
     
    <div id="myCarousel" class="carousel slide">
                        <div class="carousel-inner">
                    
                        <div class="item">
                          <div class="row box center">
                            <div class="span4 marg5">
                               <p><img src="LOGO/Autostart_Logo.gif"></p>
                              <p></p>
                            </div>
                            <div class="span4 marg5">
                               <p><img src="LOGO/compustar-pro.jpg"></p>
                              <p></p>
                            </div>
                            <div class="span4 marg5">
                               <p><img src="LOGO/dse_logo.png"></p>
                              <p></p>
                            </div>
                          </div>
                        </div>
                        
                        <div class="item">
                          <div class="row box center">
                            <div class="span4 marg5">
                               <p><img src="LOGO/fortin.jpg"> </p>
                              <p></p>
                            </div>
                            <div class="span4 marg5">
                               <p><img src="LOGO/Idatalink.jpg"></p>
                              <p></p>
                            </div>
                            <div class="span4 marg5">
                               <p><img src="LOGO/drone-logo_white-2.jpg"></p>
                              <p></p>
                            </div>
                          </div>
                        </div>
                        
                        <div class="item active">  
                          <div class="row box center">
                            <div class="span4 marg5">
                               <p><img src="LOGO/AccessLogo.jpg"></p>
                              <p></p>
                            </div>
                            <div class="span4 marg5">
                               <p><img src="LOGO/AVS322065onvehicleHR.jpg"></p>
                              <p></p>
                            </div>
                            <div class="span4 marg5">
                               <p><img src="LOGO/truck_acc_aries_sidestep_blk.gif"></p>
                              <p></p>
                            </div>
                          </div>
                        </div>
                         <div class="item">
                          <div class="row box center">
                            <div class="span4 marg5">
                               <p><img src="LOGO/class-4-5-hitch.jpg"></p>
                              <p></p>
                            </div>
                            <div class="span4 marg5">
                               <p><img src="LOGO/BANBO HID XENON KIT NEPTUNE-S.jpg"></p>
                              <p></p>
                            </div>
                            <div class="span4 marg5">
                               <p><img src="LOGO/IMG4DB82B8BA0689_500.jpg"></p>
                              <p></p>
                            </div>
                          </div>
                        </div>
                        
                        <div class="item">
                          <div class="row box center">
                            <div class="span4 marg5">
                               <p><img src="LOGO/Clarion_Logo.png"></p>
                              <p></p>
                            </div>
                            <div class="span4 marg5">
                               <p><img src="LOGO/logo-KENWOOD-best.jpg"></p>
                              <p></p>
                            </div>
                            <div class="span4 marg5">
                               <p><img src="LOGO/parrotlogo.jpg"></p>
                              <p></p>
                            </div>
                          </div>
     
     
    CSS
     
    .carousel {
      position: relative;
      margin-bottom: 5px;
      line-height: 1;
    }
     
    .carousel-inner {
      position: relative;
      width: 100%;
      overflow: hidden;
    }
     
    .carousel .item {
      position: relative;
      display: none;
      -webkit-transition: 0.6s ease-in-out left;
         -moz-transition: 0.6s ease-in-out left;
          -ms-transition: 0.6s ease-in-out left;
           -o-transition: 0.6s ease-in-out left;
              transition: 0.6s ease-in-out left;
    }
     
    .carousel .item > img {
      display: block;
      line-height: 1;
    }
     
    .carousel .active,
    .carousel .next,
    .carousel .prev {
      display: block;
    }
     
    .carousel .active {
      left: 0;
    }
     
    .carousel .next,
    .carousel .prev {
      position: absolute;
      top: 0;
      width: 100%;
    }
     
    .carousel .next {
      left: 100%;
    }
     
    .carousel .prev {
      left: -100%;
    }
     
    .carousel .next.left,
    .carousel .prev.right {
      left: 0;
    }
     
    .carousel .active.left {
      left: -100%;
    }
     
    .carousel .active.right {
      left: 100%;
    }
     
    .carousel-control {
      position: absolute;
      top: 40%;
      left: 15px;
      width: 40px;
      height: 40px;
      margin-top: -20px;
      font-size: 30px;
      font-weight: 100;
      line-height: 30px;
      color: #ffffff;
      text-align: center;
      background: #222222;
      border: 3px solid #ffffff;
      -webkit-border-radius: 23px;
         -moz-border-radius: 23px;
              border-radius: 23px;
      opacity: 0.5;
      filter: alpha(opacity=50);
    }
     
    .carousel-control.right {
      right: -25px;
      left: auto;
    }
     
    .carousel-control.left {
      left: -25px;
      right: auto;
    }
     
    .carousel-control:hover {
      color: #ffffff;
      text-decoration: none;
      opacity: 0.9;
      filter: alpha(opacity=90);
    }
     
    .carousel-caption {
      position: absolute;
      right: 0;
      bottom: 0;
      left: 0;
      padding: 10px 15px 5px;
      background: #333333;
      background: rgba(0, 0, 0, 0.75);
    }
     
    .carousel-caption h4,
    .carousel-caption p {
      color: #ffffff;
    }

     

    round total...

    in Javascript Help

    Posted

    So i have an invoice and it calculates tax.works fine but i need to round the decimals.so i don't get 12.1234$

     

    i have this

     

    function calculate(){ 
     
     if(isNaN(document.formname.f1.value) || document.formname.f1.value==""){ 
     var text1 = 0; 
     }else{ 
     var text1 = parseInt(document.formname.f1.value); 
     } 
     
     if(isNaN(document.formname.f2.value) || document.formname.f2.value==""){ 
     var text2 = 0; 
     }else{ 
     var text2 = parseFloat(document.formname.f2.value); 
     } 
     
      if(isNaN(document.formname.f3.value) || document.formname.f3.value==""){ 
     var text3 = 0; 
     }else{ 
     var text3 = parseFloat(document.formname.f3.value); 
     } 
     
      if(isNaN(document.formname.f4.value) || document.formname.f4.value==""){ 
     var text4 = 0; 
     }else{ 
     var text4 = parseFloat(document.formname.f4.value); 
     } 
     
      if(isNaN(document.formname.f5.value) || document.formname.f5.value==""){ 
     var text5 = 0; 
     }else{ 
     var text5 = parseFloat(document.formname.f5.value); 
     } 
     
     
     
     document.formname.Total.value = (text1+text2+text3+text4+text5)* 0.14975 + (text1+text2+text3+text4+text5);

    round total...

    in Javascript Help

    Posted

    Hey guys i have tried a few combinations with no luck...

     

    i have a tax cal for my invoice form but i need to round out the total not to have 1.23445

     

     

    i have tried

     

     
     document.formname.Total.value = formname.Total.value.round (text1+text2+text3+text4+text5)* 0.14975 + (text1+text2+text3+text4+text5);
     
     document.formname.Total.value = Total.round (text1+text2+text3+text4+text5)* 0.14975 + (text1+text2+text3+text4+text5);
     
     
    ...
     
    any clue how?
     
×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.