www.webdeveloper.com
Results 1 to 5 of 5

Thread: JavaScript generates empty div

  1. #1
    Join Date
    Feb 2010
    Location
    Berlin
    Posts
    97

    JavaScript generates empty div

    I'm in an early stage of redesigning a website and have come across a very annoying problem.

    The following JS snippet is necessary to show/hide an arrow to navigate across the page:

    Code:
    	$('<div></div>')
    		.insertBefore('ul#gallery > li:even a');
    		
    	var galleryeven = $('ul#gallery > li:even:not(:last) div');
    	var galleryodd = $('ul#gallery > li:odd');
    	var galleryimg = $('ul#gallery > li > a > img');
    Unfortunately it also generates an empty div <div></div> before every <a href. It's clearly visible using Firebug. Without that particular piece of code the page is working perfectly fine too, but I want the arrows to show up on mouseover.

    Please find the beta page on http://beta.beautifullalaland.com/scrolltest4.html and check the code (look for <!-- script inserts <div> before a href -->). A textbox with 2 links is at the very end of the gallery.
    Last edited by Pris; 06-30-2010 at 09:01 AM.

  2. #2
    Join Date
    Feb 2010
    Location
    Berlin
    Posts
    97
    Test page is now here.
    To overcome another quirk with automatic inserted code I put the first 2 text blocks into *yikes* tables. The tabled blocks no longer break in Firefox 3.6.3 (Mac), but still do in Safari 4.0.4.

    Curiouser and curiouser…

  3. #3
    Join Date
    Aug 2007
    Posts
    3,767
    Admittedly I never use jQuery, but from what I know of it, the code does exactly what it's supposed to.
    Code:
    $('<div></div>').insertBefore('ul#gallery > li:even a');
    I may be wrong, but I think that that code inserts an empty div before every link in the even li's.

    I would suspect that the background of that "empty" div is being changed to the arrow, hence the need for it.

  4. #4
    Join Date
    Feb 2010
    Location
    Berlin
    Posts
    97
    Quote Originally Posted by Declan1991 View Post
    Admittedly I never use jQuery, but from what I know of it, the code does exactly what it's supposed to.
    Code:
    $('<div></div>').insertBefore('ul#gallery > li:even a');
    I may be wrong, but I think that that code inserts an empty div before every link in the even li's.
    Yes, what is does is that what is advertised. The problem though is, is that there's should not be an empty <div> popping up before a hyperlink in the text.

    Any idea if there's a way to hack this behaviour?

  5. #5
    Join Date
    Aug 2007
    Posts
    3,767
    Quote Originally Posted by Pris View Post
    The problem though is, is that there's should not be an empty <div> popping up before a hyperlink in the text.
    Obviously the empty div is there for a reason, evidenced by the fact that it stops working when it's removed. Without seeing it, I would presume it's as a holder for the image. If you want the image, keep the div.

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Tags for this Thread

Posting Permissions

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



Recent Articles