Results 1 to 5 of 5

Thread: Same code but different font & color etc ?

  1. #1
    Join Date
    Nov 2011
    Location
    Cider Region
    Posts
    1,132
    Thanks
    158
    Thanked 3 Times in 3 Posts

    Default Same code but different font & color etc ?

    I currently have the below code on my ebay page which looks after the text assigned blinking.

    Code:
    .blinking {
    -moz-transition:all 1s ease-in-out;
    -webkit-transition:all 1s ease-in-out;
    -o-transition:all 1s ease-in-out;
    -ms-transition:all 1s ease-in-out;
    transition:all 1s ease-in-out;
    /* order: name, direction, duration, iteration-count, timing-function */ 
    -moz-animation:blink normal 2s infinite ease-in-out; /* Firefox */
    -webkit-animation:blink normal 2s infinite ease-in-out; /* Webkit */
    -ms-animation:blink normal 2s infinite ease-in-out; /* IE */
    animation:blink normal 2s infinite ease-in-out; /* Opera and prob css3 final iteration */
    color: #000099;
    font-weight: bold;
    font-size: 14px;
    text-align: center;
    }
    I now need to highlite another part of my text BUT with a different font color & size so do i have to copy & paste all the above & make the changes or can an edit bee added to the above code.
    I was thing along the lines of different text that needs this doing would then make the code on the page longer & longer every time.

  2. #2
    Join Date
    Jul 2008
    Location
    Derbyshire, UK
    Posts
    3,033
    Thanks
    25
    Thanked 599 Times in 575 Posts
    Blog Entries
    40

    Default

    It's hard to say without seeing the markup of the element this is applied to, or the markup of the element you now want to target, but I try applying this .blinking class to the new element but also add a second class with a different colour defined in the CSS. Example;
    Code:
    <div class="blinking red-text">stuff that blinks</div>
    Code:
    .blinking.red-text { color:red }
    Focus on Function Web Design
    Fast Edit (A flat file, PHP web page editor & CMS. Small, FREE, no database!) | Fast Edit BE (Snippet Manager) (Web content editor for multiple editable regions!) | Fast Apps

  3. #3
    Join Date
    Nov 2011
    Location
    Cider Region
    Posts
    1,132
    Thanks
    158
    Thanked 3 Times in 3 Posts

    Default

    Hi,
    Here is a page that i will change.
    http://www.ebay.co.uk/itm/1121170757...84.m1558.l2649

    Two lines of blue blinking text.
    The first line Remote not included in sale will be changed to white & 20px

    Thanks

  4. #4
    Join Date
    Jul 2008
    Location
    Derbyshire, UK
    Posts
    3,033
    Thanks
    25
    Thanked 599 Times in 575 Posts
    Blog Entries
    40

    Default

    I'm on mobile so the link doesn't mean much, but have you tried what I suggested? Give it a go - it may need adapting using the normal rules of CSS selectors though.

    If you are still experiencing problem, shows us what you've tried in a reduced demo using JSBin, JSFiddle or CodePen (I don't fancy poking through dozens of unknown elements and assets in the developer console). Help us to help you - the easier you make it for us by providing the pertinent HTML and CSS upfront, the faster we can make suggestions.
    Focus on Function Web Design
    Fast Edit (A flat file, PHP web page editor & CMS. Small, FREE, no database!) | Fast Edit BE (Snippet Manager) (Web content editor for multiple editable regions!) | Fast Apps

  5. #5
    Join Date
    Nov 2011
    Location
    Cider Region
    Posts
    1,132
    Thanks
    158
    Thanked 3 Times in 3 Posts

    Default

    Hi,
    Your advised code worked fine.

    Many thanks & have a nice evening.

Similar Threads

  1. About font color
    By satimis in forum Dynamic Drive scripts help
    Replies: 2
    Last Post: 03-10-2008, 01:44 AM
  2. Font color in Java CSS
    By dmaier in forum CSS
    Replies: 3
    Last Post: 08-04-2006, 09:45 AM
  3. mouseover font color
    By Chadi in forum CSS
    Replies: 6
    Last Post: 03-14-2006, 05:23 PM
  4. font color
    By Chadi in forum JavaScript
    Replies: 1
    Last Post: 03-09-2006, 09:30 PM
  5. font color change
    By Chadi in forum HTML
    Replies: 2
    Last Post: 12-24-2005, 05:12 AM

Bookmarks

Posting Permissions

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