#1
  1. No Profile Picture
    Contributing User
    Devshed Newbie (0 - 499 posts)

    Join Date
    Feb 2008
    Posts
    110
    Rep Power
    24

    JQ changing the text of a span


    I'm having a problem with a little JQ. I had this working before and I think I tweaked something but now it's no longer functional. I just want to rule out it being my JS. Basically, when you hover over the span, it should show you some HTML from the data-team-score but it's no longer doing it.

    Any help? I've looked it over and over. If the code below looks good then it must be the HTML inside the data tags.

    Here's the HTML...
    Code:
    <span id="scr591236" data-my-score="some html in here" data-team-score="some html in here as well" class="social_stats">some text in here</span>
    <span id="scr597405" data-my-score="some html in here" data-team-score="some html in here as well" class="social_stats">some text in here</span>

    Here's the JS...
    Code:
    $("#scr591236, #scr597405").mouseover(function () {
    		var $this = $(this);
    		$this.fadeTo(500, 0, function() {
    			$this
    			  .hide()
    			  .html($this.data("team-score"))
    			  .show()
    			  .fadeTo(500, 1); 
    		});
  2. #2
  3. No Profile Picture
    Registered User
    Devshed Newbie (0 - 499 posts)

    Join Date
    Jul 2012
    Posts
    24
    Rep Power
    0
    I don't think this is correct: $("#scr591236, #scr597405")
    You can't use a comma separated list of elements.

    Anyway , I think this will help:
    Code:
    // Target all elements with a class of 'social_stats'
    $(".social_stats").on('mouseover',function(){
    $this = $(this);
    
    // When hovered over, fade out in 500 milliseconds
    $this.fadeOut(500,function(){
    $this.html( $this.data("team-score") );
    }).fadeIn(500);
    
    });
    Léon

IMN logo majestic logo threadwatch logo seochat tools logo