Question

I am using the following code to dynamically set a href link to open up some content as a lightbox.

<script>
    $(document).ready(function() {
                               
        $(".views-field-nid-1 > .field-content > a").each(
            function(){
        
                $(this).click(
                    function(e){
                        e.preventDefault();
                        $(this).attr("rel", "lightframe[|width:1100px; height:700px;]");
                        Lightbox.initList();
                        return true;    
                    }
                );

            }
        );
    });
</script>

The problem I am having is that the links don’t work unless you click on them twice and I can’t explain why except to guess there are two such links on my webpage.

To explain further, I click on the "Enlarge Floorplan" links on the right hand of this page. There is one such button for each of the floorplans on display.

Answer 1

Why didn’t you add the rel with a loop:

$(".views-field-nid-1 > .field-content > a").each(function(index) {
    $(this).attr("rel", "lightframe[|width:1100px; height:700px;]");
});

And after that use your lightbox without problem and without needing a double click?