background image

Discussion in 'CSS' started by silverz, Dec 9, 2010.

0
  1. #1
    Right now, in part of my css file I have the following:

    body {
    background-color:#000000;
    background-image:url("http://www.domain.com/image.jpg");
    background-repeat:repeat;
    margin:0;
    }

    Is there a way to code it so that clicking on the image loads another website and for that other website to appear in a new window ?
     
    silverz, Dec 9, 2010 IP
  2. Toneek Muz

    Toneek Muz Peon

    Messages:
    36
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    0
    #2
    I don't think that you can make link in css. U must post link in html file, for example:
    <body>
    <a href="http://yoursite.com" target="_blank">&nbsp;</a>
    ...
     
    Toneek Muz, Dec 9, 2010 IP
  3. silverz

    silverz Peon

    Messages:
    100
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    0
    #3
    any other ideas?
     
    silverz, Dec 9, 2010 IP
  4. Toneek Muz

    Toneek Muz Peon

    Messages:
    36
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    0
    #4
    U can also make it with JavaScript, but again in your *.php/*.html file. There are no way to make it in css, sorry.
     
    Toneek Muz, Dec 9, 2010 IP
  5. CSM

    CSM Active Member

    Messages:
    1,047
    Likes Received:
    25
    Best Answers:
    0
    Trophy Points:
    55
    #5 
    
target="_blank"
    Code (markup):
    is not valid XHTML, just to mention.

    CSS is for the styling, nothing more. Links can not be set in CSS, only in HTML.
     
    CSM, Dec 10, 2010 IP
  6. Toneek Muz

    Toneek Muz Peon

    Messages:
    36
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    0
    #6
    CSM I know, but I usualy use html, not xhtml. Sorry for offtopic, I don't understand reason why it's better to use xHTML?
     
    Toneek Muz, Dec 10, 2010 IP
  7. CSM

    CSM Active Member

    Messages:
    1,047
    Likes Received:
    25
    Best Answers:
    0
    Trophy Points:
    55
    #7
    Maybe he uses XHTML?

    I did not say it's better to use XHTML. I only do XHTML when coding from scratch :)

    Oh and by the way:

    
body {
background-color:#000000;
background-image:url("http://www.domain.com/image.jpg");
background-repeat:repeat;
margin:0;
}
    Code (markup):
    can be done in 2 properties:

    
body {
background: #000 url("http://www.domain.com/image.jpg") repeat;
margin:0;
}
    Code (markup):
     
    CSM, Dec 10, 2010 IP
  8. runner

    runner Active Member

    Messages:
    251
    Likes Received:
    1
    Best Answers:
    0
    Trophy Points:
    53
    #8 
    body{
	width:100%;
	height:100%;
}
#back_link{
	display:block;
	width:100%;
	height:100%;
}
    Code (markup):
    <a id="back_link" href="" onclick="window.open(this.href,'_blank');return false;"></a>
    Code (markup):
    You meant something like this?
     
    runner, Dec 11, 2010 IP
  9. silverz

    silverz Peon

    Messages:
    100
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    0
    #9
    Hey runner,

    where would i put the URL path for the background image itself in your code ?
     
    silverz, Dec 11, 2010 IP
  10. radiant_luv

    radiant_luv Peon

    Messages:
    1,327
    Likes Received:
    34
    Best Answers:
    1
    Trophy Points:
    0
    #10 
    #back_link{
background: url('images/background.jpg') no-repeat;
}
    Code (markup):
     
    radiant_luv, Dec 11, 2010 IP
  11. silverz

    silverz Peon

    Messages:
    100
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    0
    #11
    Where do I put the following code for this to work: <a id="back_link" href="" onclick="window.open(this.href,'_blank');return false;"></a>
     
    silverz, Dec 12, 2010 IP
  12. runner

    runner Active Member

    Messages:
    251
    Likes Received:
    1
    Best Answers:
    0
    Trophy Points:
    53
    #12 
    
<html>
<head>
<style type="text/css">
body{
	width:100%;
	height:100%;
}
#back_link{
	display:block;
	width:100%;
	height:100%;
}
</style>
</head>
<body>
<a id="back_link" href="http://example.com" onclick="window.open(this.href,'_blank');return false;">Click Here!</a>
</body>
</html>
    Code (markup):
     
    runner, Dec 15, 2010 IP