Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 4 of 4
  1. #1
    New Coder
    Join Date
    Apr 2010
    Posts
    72
    Thanks
    30
    Thanked 0 Times in 0 Posts

    Unhappy Problems with swapping/reverse two divs

    Hello guys!

    I am having a very confusing and annoying problem by swapping arround two divs using this script:

    Code:
    <script type="text/javascript">
    //<![CDATA[
    $(function(){
    $('.sidebar').each(function () {
        $(this).insertBefore($(this).prev('.content'));
    });
    });//]]>
    </script>
    It works here:
    Edit fiddle - JSFiddle


    But when I paste the script into head on my website, it has no effects on the two div I want to swap/reverse

    You can see the website here: Heilpraktik Estell

    It is a wordpress site and the theme I use is Avada.

    I will be very glad and grateful if someone can help me out

    Best Regards

  • #2
    Senior Coder
    Join Date
    Jan 2011
    Location
    Missouri
    Posts
    4,286
    Thanks
    23
    Thanked 611 Times in 610 Posts
    The code you posted here needs a class of sidebar and content. You have neither.

    AND the link you gave has something differt:
    <script type="text/javascript">
    $('div > div').each(function() {
    $(this).prependTo(this.parentNode);
    });
    </script>

    ????
    Evolution - The non-random survival of random variants.

    "If you leave hydrogen alone, for long enough, it begins to think about itself."

  • #3
    New Coder
    Join Date
    Apr 2010
    Posts
    72
    Thanks
    30
    Thanked 0 Times in 0 Posts
    Quote Originally Posted by sunfighter View Post
    The code you posted here needs a class of sidebar and content. You have neither.

    AND the link you gave has something differt:
    <script type="text/javascript">
    $('div > div').each(function() {
    $(this).prependTo(this.parentNode);
    });
    </script>

    ????
    Hi and thank you for your answer.

    If you look at the website, you will find an ID for the content (#content) and one for the sidebar (#sidebar).
    (It's located in "#wrapper > #main > .avada-row > #content/#sidebar")

    Sorry, my bad - it was not classes but id's.

    So the code would be:
    Code:
    <script type="text/javascript">//<![CDATA[ 
    $(function(){
    $('#sidebar').each(function () {
        $(this).insertBefore($(this).prev('#content'));
    });
    });//]]>  
    </script>
    Here is a correct JSFiddle example (it works in JSFiddle but not on my website):
    Edit fiddle - JSFiddle

    I really hope someone can help me!

    NOTE!:
    This line of javascript works too in JSFiddle but not on my website:
    Code:
    $('#sidebar').insertBefore($('#content'));
    I guess there is no need to call each function?

    And sorry - I forgot to say that I know nothing about javascript programming. I just try my best with no luck I guess :/

    Best Regards
    Last edited by Samz3n; 05-30-2014 at 01:06 PM.

  • #4
    Senior Coder
    Join Date
    Jan 2011
    Location
    Missouri
    Posts
    4,286
    Thanks
    23
    Thanked 611 Times in 610 Posts
    When I load your page I can see the divs, both sidebar and content. I also see them exchange places and then your DNA image http://heilpraktik.identitest.dk/wp-.../2014/05/1.jpg covers up the content div.

    IMHO you have a simple site that can be done entirely in HTML/CSS and you have over complicated it with tons of JS that is not needed. I see no reason to swap divs on load when the final page can be done in html without swapping anything.
    Evolution - The non-random survival of random variants.

    "If you leave hydrogen alone, for long enough, it begins to think about itself."


  •  

    Posting Permissions

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