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 3 of 3
  1. #1
    New to the CF scene
    Join Date
    Apr 2014
    Posts
    2
    Thanks
    1
    Thanked 0 Times in 0 Posts

    html link over embed swf file doesn't work in chrome

    hi experts and welcome everyone,

    I am confused about how to display links over flash object in google chrome.
    I use <embed> tag to embed swf file.

    Here is my little code snippet, which try to display the embedded swf file.
    Code:
    <a href="http://nutritiondata.self.com"><embed src="sample.swf" width="468" height="60" wmode="transparent" type="application/x-shockwave-flash">
    </embed></a>
    In google chrome when i clicked on the flash file , it doesn't redirect to the url (which was set in the a tag -> href property)

    But in firefox, it works correctly.

    is the any trick, for chrome?
    Could someone help me?

    any help would be greatly appreciated.

    many thanks.

  • #2
    Senior Coder coothead's Avatar
    Join Date
    Jan 2004
    Location
    chertsey, a small town 25 miles south west of london, england.
    Posts
    1,699
    Thanks
    0
    Thanked 233 Times in 228 Posts
    Hi there Vizsla,

    and a warm welcome to these forums.

    without the benefit of having your .swf file, you will have to play around with this example...
    Code:
    
    <!DOCTYPE html>
    <html lang="en">
    <head>
    
    <meta charset="utf-8">
    
    <title>"div", "object" and "a" elements</title>
    
    <style>
    body {
        background-color:#f0f0f0;
     }
    #flash {
        position:relative;
        width:600px;
        height:400px;
        border:1px solid #c0c;
        border-radius:50%;
        margin:auto;
        box-shadow:10px 10px 10px #666;
     }
    div object {
        display:block;
        width:600px;
        height:400px;
        border-radius:50%;
        background-color:#1e0033;
        box-shadow:inset 0 0 30px #606;
     }
    div a {
        position:absolute;
        width:600px;
        height:400px;
        border-radius:50%;
        top:1px;
        left:1px;
     }
    </style>
    
    </head>
    <body>
    
    <div id="flash">
    
    <object type="application/x-shockwave-flash" data="http://www.coothead.co.uk/chswf.swf">
     <param name="movie" value="http://www.coothead.co.uk/chswf.swf">
     <param name="wmode" value="transparent">
    </object>
    
    <a href="http://nutritiondata.self.com"></a>
    
    </div>
    
    </body>
    </html>
    coothead

  • Users who have thanked coothead for this post:

    Vizsla (04-12-2014)

  • #3
    New to the CF scene
    Join Date
    Apr 2014
    Posts
    2
    Thanks
    1
    Thanked 0 Times in 0 Posts
    Hi cootead,

    Many thanks for taking time to resolve my problem I minimalized your code about the stylesheet, and i try to understand it.

    i play around your example, uncomment and comment lines and i check the apperance on the firefox and chrome.

    I going to share my experinces, below the code snippet.


    Code:
    <style>
    #flash {
        position:relative; <!-- not affected my code -->
        width:600px;  <!-- if width and height not present , object tag slips to the left side of the page -->
        height:400px;
        border:1px solid #c0c;
        border-radius:50%;
        margin:auto;
        box-shadow:10px 10px 10px #666;
     }
    div object {
        display:block;                    <!-- if not present , link of <a> tag slips to the right side --> 
        width:600px;  <!-- if width and height not present ,in firefox swf file disappears totally, in chrome the file shrinks -->
        height:400px;
        border-radius:50%;
    	background-color:#1e0033;
        box-shadow:inset 0 0 30px #606;
     }
    div a {
        position:absolute;  <!-- if not present , link in the <a> tag disappears --> 
        width:600px;  <!-- if width and height not present , link disappears --> 
        height:400px;
        border-radius:50%;
        top:1px;  <!-- if not present , link in the <a> tag slips to the under of swf file -->
        
     }
    </style>
    thanks again


  •  

    Posting Permissions

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