Jump to content

Search the Community

Showing results for tags 'fadeIn'.



More search options

  • Search By Tags

    Type tags separated by commas.
  • Search By Author

Content Type


Forums

  • W3Schools
    • General
    • Suggestions
    • Critiques
  • HTML Forums
    • HTML/XHTML
    • CSS
  • Browser Scripting
    • JavaScript
    • VBScript
  • Server Scripting
    • Web Servers
    • Version Control
    • SQL
    • ASP
    • PHP
    • .NET
    • ColdFusion
    • Java/JSP/J2EE
    • CGI
  • XML Forums
    • XML
    • XSLT/XSL-FO
    • Schema
    • Web Services
  • Multimedia
    • Multimedia
    • FLASH

Find results in...

Find results that contain...


Date Created

  • Start

    End


Last Updated

  • Start

    End


Filter by number of...

Joined

  • Start

    End


Group


AIM


MSN


Website URL


ICQ


Yahoo


Jabber


Skype


Location


Interests


Languages

Found 4 results

  1. Hi there, I’m a newbie in coding HTML, CSS (very poor in JS) and I would like to make a responsive navbar like that: https://www.w3schools.com/howto/howto_js_topnav_responsive.asp (here the code: https://www.w3schools.com/howto/tryit.asp?filename=tryhow_js_topnav). My question is, when the navbar is in “responsive mode” and when clicking the menu button (right side in the example), is it possible to produce a "fade in/out" effects in order to display the menu items? Thank you in advance for your time and for any help you can provide. Sergio
  2. Hello, I recently used this code that I got from a working fade in slider on the internet. The only thing I've changed are the images, the rest has stayed the same. When I load up the site in Safari it doesn't slide or fade, it just shows one image the entire time. What am I doing wrong? Heres the code I used from the internet HTML <div class="fadein"> <img src="http://farm9.staticflickr.com/8359/8450229021_9d660578b4_n.jpg"> <img src="http://farm9.staticflickr.com/8510/8452880627_0e673b24d8_n.jpg"> <img src="http://farm9.staticflickr.com/8108/8456552856_a843b7a5e1_n.jpg"> <img src="http://farm9.staticflickr.com/8230/8457936603_f2c8f48691_n.jpg"> <img src="http://farm9.staticflickr.com/8329/8447290659_02c4765928_n.jpg"></div> CSS .fadein { position:relative; height:320px; width:320px;}.fadein img { position:absolute; left:0; top:0;} JS $('.fadein img:gt(0)').hide();setInterval(function () { $('.fadein :first-child').fadeOut() .next('img') .fadeIn() .end() .appendTo('.fadein');}, 4000); // 4 seconds
  3. Hi, I'm trying to replicate CSS3 transition effects for older versions of IE that don't support these transition effects. I'm trying to use the jQuery: $('#myelement').fadeIn(); However, I'm exceptionally bad at understanding Javascript and need some help making this code do what I want. What I want is when you hover over an image with the class "left1", I want it to grow to the specifications I have in my styelsheet for left1:hover. Of course, while transitioning. I already have the code exactly how I want it for CSS and HTML and already have jQuery linked up with my page. Now how do I integrate the code above for transitioning it? Thanks! P.S. I am aware that having the transition effects while trying to get the jQuery working can cause complications, so when I test it out I will/am removing the transition properties from the stylesheet.
  4. Hi folksI'm trying to initiate a click event (and subsequent image fade in) when a user clicks on a thumbnail. That in itself isn't such a problem. The problem lies in the fact that the thumbnails are contained in an array and are displayed with an append within an each loop (see code below). I've gotten halfway there, the code below does initiate a fade in when a thumbnail is clicked - however, it fades in all the images as opposed to just the one relating to the thumbnail that is clicked on. I know this is because by the time the #test append happened all the images have loaded so it just displays all of them. The question is, how can I get it to just display the full image related to the thumbnail that's been clicked on? I'm pretty new to this so apologies if this seems a bit pedestrian. Thanks in advanceStef For reference purposes:array[0] refers to id of imagearray[6] is the thumbnail urlarray[7] is the full image urlarray[8] & array[9] are x and y coordinates of the thumbnail on the page function display (array) { $.each(array, function(i){ $('#container').append( '<div id="'+array[i][0]+'" style="position: absolute; left:'+array[i][8]+'px; top: '+array[i][9]+'px;"><img src=images/'+array[i][6]+' id=nav width=85 height=85></div>' ); $('#test').append( '<div id="'+array[i][0]+'" style="width: 398px;"><img src=images/'+array[i][7]+' id=nav width=398>' ); $("#"+array[i]).click(function () { $("#test").fadeIn('slow', function () {// animation complete}); }); });} Full page attached upload.php
×
×
  • Create New...