MyBB Community Forums

Full Version: I Need Some Help With Gradients
You're currently viewing a stripped down version of our content. View the full version with proper formatting.
I have been trying to apply a gradient to the "a:visited" and I have not had no luck.
I have tried these
a:visited{
color: #026CB1;
text-decoration: none;
background-image: linear-gradient(bottom, rgb(22,82,41) 34%, rgb(49,115,70) 67%, rgb(79,150,98) 84%);
background-image: -o-linear-gradient(bottom, rgb(22,82,41) 34%, rgb(49,115,70) 67%, rgb(79,150,98) 84%);
background-image: -moz-linear-gradient(bottom, rgb(22,82,41) 34%, rgb(49,115,70) 67%, rgb(79,150,98) 84%);
background-image: -webkit-linear-gradient(bottom, rgb(22,82,41) 34%, rgb(49,115,70) 67%, rgb(79,150,98) 84%);
background-image: -ms-linear-gradient(bottom, rgb(22,82,41) 34%, rgb(49,115,70) 67%, rgb(79,150,98) 84%);

background-image: -webkit-gradient(
	linear,
	left bottom,
	left top,
	color-stop(0.34, rgb(22,82,41)),
	color-stop(0.67, rgb(49,115,70)),
	color-stop(0.84, rgb(79,150,98))
);
}
The browsers I got installed are
IE 10
firefox 10UX
pail moon 7
chrome 16.0.904.0
Are you attempting to make the text a gradient?
(2011-10-11, 06:46 PM)Jason L. Wrote: [ -> ]Are you attempting to make the text a gradient?

yes for the visited links

background-image doesn't apply to text.

You can wrap the text into a div/span/p and make the background a gradient, but not the text color itselft.
(2011-10-11, 07:06 PM)Sama34 Wrote: [ -> ]background-image doesn't apply to text.

You can wrap the text into a div/span/p and make the background a gradient, but not the text color it self.

I was also trying canvas and I tried jquary

Is there away I can do it

(2011-10-11, 07:14 PM)Howman Wrote: [ -> ]
(2011-10-11, 07:06 PM)Sama34 Wrote: [ -> ]background-image doesn't apply to text.

You can wrap the text into a div/span/p and make the background a gradient, but not the text color it self.

I was also trying canvas and I tried jquary

Is there away I can do it

http://net.tutsplus.com/tutorials/html-c...gradients/

Sometimes a quick google search can be very helpful.
(2011-10-11, 07:26 PM)Jason L. Wrote: [ -> ]
(2011-10-11, 07:14 PM)Howman Wrote: [ -> ]
(2011-10-11, 07:06 PM)Sama34 Wrote: [ -> ]background-image doesn't apply to text.

You can wrap the text into a div/span/p and make the background a gradient, but not the text color it self.

I was also trying canvas and I tried jquary

Is there away I can do it

http://net.tutsplus.com/tutorials/html-c...gradients/

Sometimes a quick google search can be very helpful.

I have come across that but its for web kit only I usually use IE or Firefox so that would not help me

I found this but I do not know how I would use it

<?php

/* Create a new imagick object */
$im = new Imagick();

/* Create new image. This will be used as fill pattern */
$im->newPseudoImage(50, 50, "gradient:red-black");

/* Create imagickdraw object */
$draw = new ImagickDraw();

/* Start a new pattern called "gradient" */
$draw->pushPattern('gradient', 0, 0, 50, 50);

/* Composite the gradient on the pattern */
$draw->composite(Imagick::COMPOSITE_OVER, 0, 0, 50, 50, $im);

/* Close the pattern */
$draw->popPattern();

/* Use the pattern called "gradient" as the fill */
$draw->setFillPatternURL('#gradient');

/* Set font size to 52 */
$draw->setFontSize(52);

/* Annotate some text */
$draw->annotation(20, 50, "Hello World!");

/* Create a new canvas object and a white image */
$canvas = new Imagick();
$canvas->newImage(350, 70, "white");

/* Draw the ImagickDraw on to the canvas */
$canvas->drawImage($draw);

/* 1px black border around the image */
$canvas->borderImage('black', 1, 1);

/* Set the format to PNG */
$canvas->setImageFormat('png');

/* Output the image */
header("Content-Type: image/png");
echo $canvas;
?>