Results 1 to 3 of 3

Thread: adding on click event

  1. #1
    Join Date
    Sep 2010
    Posts
    16
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default adding on click event

    1) Script Title: Continuous Reel Slideshow

    2) Script URL (on DD): http://www.dynamicdrive.com/dynamici...lslideshow.htm

    3) Describe problem: I want to add an on click event to the urls

    I want to add an on click event to track which banners are clicked the most is that possible? Before I was using:

    Code:
    <a onclick="return clicktrack( 'tab',<?php echo $value2['id'] ?>,'' );" href="<?php echo $value2['url'] ?>"<?php if( $value2['newwin']==1 ) { ?> target="_blank"<?php } ?>>
    but now I'm just using:

    Code:
    imagearray: [<?php shuffle($tabblock);
    	foreach( $tabblock as $key=>$value2 ) { ?>
    <?php
    echo  '["/images/dynamic/'.$value2['image'].'", "'.$value2['url'].'"],';
    ?>	<?php } ?>],

  2. #2
    Join Date
    Sep 2010
    Posts
    16
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    I changed line 137 in the reelslideshow.js file to:
    Code:
    var layerHTML=(imgref[1])? '<a onclick="return clicktrack( \'tab\','+imgref[3]+',\'\' );" href="'+imgref[1]+'" target="'+imgref[2]+'">' : '' //hyperlink slide?
    Then added this to the code in the php file:
    Code:
    imagearray: [
                  <?php shuffle($tabblock); foreach( $tabblock as $key=>$value2 ) { ?>
                  <?php echo  '["/images/dynamic/'.$value2['image'].'", "'.$value2['url'].'"'; if( $value2['newwin']==1 ) {  echo ', "_blank",'; } else { echo ', "_self",'; } echo '"'.$value2['id'].'"]'; if( $key<count( $tabblock )-1 ) { echo ","; } ?>
                  <?php } ?>
                ],
    I also removed the jquery.touchSwipe.min.js file as that was stopping the links from working in everything but Chrome

  3. #3
    Join Date
    Dec 2008
    Location
    Portsmouth, UK
    Posts
    1,891
    Thanks
    2
    Thanked 441 Times in 435 Posts

    Default

    or

    modify function

    Code:
    function reelslideshow(options){
    	var $=jQuery
        this.setting={displaymode:{type:'auto', pause:2000, cycles:2, pauseonmouseover:true}, orientation:'h', persist:true, slideduration:500} //default settings
        reelslideshow[options.wrapperid]=this;
        this.cnt=[];
    	jQuery.extend(this.setting, options) //merge default settings with options
    	var curslide=(this.setting.persist)? reelslideshow.routines.getCookie("slider-"+this.setting.wrapperid) : 0
    	this.curslide=(curslide==null || curslide>this.setting.imagearray.length-1)? 0 : parseInt(curslide) //make sure curslide index is within bounds
    	this.curstep=0
    	this.zIndex=1
    	this.animation_isrunning=false //variable to indicate whether an image is currently being slided in
    	this.posprop=(this.setting.orientation=="h")? "left" : "top"
    	options=null
    	var slideshow=this, setting=this.setting, preloadimages=[], slidesHTML=''
    	for (var i=0; i<setting.imagearray.length; i++){ //preload images
    		preloadimages[i]=new Image()
    		preloadimages[i].src=setting.imagearray[i][0];
            this.cnt[i]=0;
    		slidesHTML+=reelslideshow.routines.getSlideHTML(setting.imagearray[i], setting.dimensions[0]+'px', setting.dimensions[1]+'px', this.posprop,this.setting.wrapperid,i)+'\n'
    	}
    	jQuery(function($){ //on document.ready
    		slideshow.init($, slidesHTML)
    	})
    	$(window).bind('unload', function(){ //on window onload
    		if (slideshow.setting.persist) //remember last shown slide's index?
    			reelslideshow.routines.setCookie("slider-"+setting.wrapperid, slideshow.curslide)
    	})
    }

    modify function

    Code:
    	getSlideHTML:function(imgref, w, h, posprop,id,i){
    		var posstr=posprop+":"+((posprop=="left")? w : h)
        	var layerHTML=(imgref[1])? '<a href="'+imgref[1]+'" target="'+imgref[2]+'">' : '' //hyperlink slide?
    		layerHTML+='<img src="'+imgref[0]+'" style="border-width:0;" dataid='+id+' datanu='+i+' onclick="Count(this);" />'
    		layerHTML+=(imgref[1])? '</a>' : ''
    		return '<div class="slide" style="position:absolute;'+posstr+';width:'+w+';height:'+h+';text-align:center;">'
    			+'<div style="width:'+w+';height:'+h+';display:table-cell;vertical-align:middle;">'
    			+layerHTML
    			+'</div></div>' //return HTML for this layer
    	},
    new function

    Code:
    function Count(o,i){
     var oop=reelslideshow[o.dataid],n=o.datanu,op=document.getElementById(o.dataid+'op');
     if (oop){
      oop.cnt[n]++;
      op?op.value=oop.cnt:null;
     }
    }
    html

    Code:
    <div id="myreel"></div>
    
    <div class="paginate">
    ≤ <a href="javascript:firstreel.navigate('back')" style="margin-right:200px;">back</a>  <a href="javascript:firstreel.navigate('forth')">forth</a> ≥
    </div>
    
    <input id="myreelop"  />
    Vic
    God Loves You and will never love you less.
    http://www.vicsjavascripts.org/Home.htm
    If my post has been useful please donate to http://www.operationsmile.org.uk/

Similar Threads

  1. Adding an onblur event to a selectbox div only mockup
    By jason_kelly in forum JavaScript
    Replies: 5
    Last Post: 11-24-2013, 08:33 PM
  2. How to fire click event of an LI tag?
    By round in forum JavaScript
    Replies: 12
    Last Post: 01-16-2013, 01:59 PM
  3. [HELP] Click event inside javascript
    By 4rum25 in forum JavaScript
    Replies: 0
    Last Post: 09-14-2010, 07:51 AM
  4. MooTools: Problem with click event.
    By JBottero in forum JavaScript
    Replies: 2
    Last Post: 08-31-2009, 12:28 PM
  5. Adding an onClick event
    By mrickert in forum Dynamic Drive scripts help
    Replies: 8
    Last Post: 08-04-2005, 01:08 PM

Bookmarks

Posting Permissions

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