UMD Web Utilities Library
    Preparing search index...

    Function createImageOrLinkedImage

    • Creates an image element, optionally wrapped in a secure external link

      Creates an HTMLImageElement with proper accessibility attributes. If a link URL is provided, wraps the image in an anchor element. By default, links open in a new tab with security attributes.

      Parameters

      • imageUrl: {
            altText: string;
            imageUrl: string;
            linkLabel?: string;
            linkUrl?: string;
            openInNewTab?: boolean;
        }

        The source URL for the image

      Returns HTMLImageElement | HTMLAnchorElement

      HTMLImageElement or HTMLAnchorElement containing the image

      // Simple image
      const image = createImageOrLinkedImage({
      imageUrl: '/images/photo.jpg',
      altText: 'Team photo from 2024'
      });
      document.body.appendChild(image);

      // Image wrapped in link (opens in new tab)
      const linkedImage = createImageOrLinkedImage({
      imageUrl: '/images/expert.jpg',
      altText: 'Dr. Jane Smith headshot',
      linkUrl: '/experts/jane-smith',
      linkLabel: 'View Dr. Jane Smith profile'
      });
      document.body.appendChild(linkedImage);

      // Same-tab link
      const sameTabImage = createImageOrLinkedImage({
      imageUrl: '/images/event.jpg',
      altText: 'Event banner',
      linkUrl: '/events/friday-flower-power',
      openInNewTab: false
      });