SitePoint Sponsor

User Tag List

Results 1 to 7 of 7
  1. #1
    SitePoint Guru r2d2's Avatar
    Join Date
    Dec 2003
    Location
    In my van, fool!
    Posts
    646
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Making a form's Submit button look like a regular link

    On a site I am working on, a major part of it is going to be search results. I would like to be able to have links at the bottom of the search results for page 2, page 3, page 4 etc (like Google sort of thing).

    Is this possible with forms? Can I leave the variables in hidden inputs, and use CSS to make the submit button look like a regular link. I can do it in Firefox, but I think IEs useless CSS has :hover restricted to <a> links.

    Will I have to just put the variables in the URL and use a regular link?

  2. #2
    ☆★☆★ silver trophy vgarcia's Avatar
    Join Date
    Jan 2002
    Location
    in transition
    Posts
    21,235
    Mentioned
    1 Post(s)
    Tagged
    1 Thread(s)
    Quote Originally Posted by r2d2
    On a site I am working on, a major part of it is going to be search results. I would like to be able to have links at the bottom of the search results for page 2, page 3, page 4 etc (like Google sort of thing).

    Is this possible with forms? Can I leave the variables in hidden inputs, and use CSS to make the submit button look like a regular link. I can do it in Firefox, but I think IEs useless CSS has :hover restricted to <a> links.
    I think Google just uses regular links. I'm not too sure what you mean. As for the CSS/submit button looking like a link thing, yes it's possible, but without :hover support in IE/Windows, any mouseover/focus action you want that link to have will have to be done with Javascript. Example:
    HTML Code:
    <input type="submit" name="goNext" value="Next" 
    style="background: transparent; border: none; text-decoration: underline; font-weight: bold; color: blue;" 
    onmouseover="this.style.color='red';" 
    onmouseout="this.style.color='blue';" />

  3. #3
    SitePoint Guru r2d2's Avatar
    Join Date
    Dec 2003
    Location
    In my van, fool!
    Posts
    646
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Yeah, Google uses regular links, was just using it as an example of what I was after visually.

    Thanks though Vinnie, I will have a go at using JS - normally try not to use it, but as my search result links use JS, I might as well

  4. #4
    PHP Otaku Gibb's Avatar
    Join Date
    Jul 2004
    Location
    Texas
    Posts
    454
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    sorry to bring this thread back from the grave, but I had a question about this very thing.

    I'm trying to get my Submit buttons to have :hover effects like links. I got vgarcia's example working ok, but when i go to highlight (like you can highlight CSS styled text-buttons), but i cant highlight the text and copy/paste it. Will google and search engines be able to navigation through the site if the javascript is used like this?

    I'm trying to make my site as google friendly as possible, no images for anything except the top logo.

  5. #5
    The CSS Clinic is open silver trophybronze trophy
    Paul O'B's Avatar
    Join Date
    Jan 2003
    Location
    Hampshire UK
    Posts
    40,556
    Mentioned
    183 Post(s)
    Tagged
    6 Thread(s)
    Hi,

    I'm not sure why you are making submit buttons into links, or have I got the wrong end of the stick.

    Regarding google navigating javascript links the there seems to be people hat say yes and people that say no! However it seems that google will not follow fom links from what I can gather.

    Anyway have a look for your self at these links:


    http://www.sitepoint.com/forums/show...08#post1046308
    http://diveintoaccessibility.org/day...eal_links.html
    http://www.evolt.org/article/Links_a...mony/17/20938/

    This tool is supposed to tell you what links google can see on your site.

    http://www.gritechnologies.com/tools/spider.go

    Hope that helps.

    Paul

  6. #6
    ☆★☆★ silver trophy vgarcia's Avatar
    Join Date
    Jan 2002
    Location
    in transition
    Posts
    21,235
    Mentioned
    1 Post(s)
    Tagged
    1 Thread(s)
    Quote Originally Posted by Gibb
    sorry to bring this thread back from the grave, but I had a question about this very thing.

    I'm trying to get my Submit buttons to have :hover effects like links. I got vgarcia's example working ok, but when i go to highlight (like you can highlight CSS styled text-buttons), but i cant highlight the text and copy/paste it. Will google and search engines be able to navigation through the site if the javascript is used like this?

    I'm trying to make my site as google friendly as possible, no images for anything except the top logo.
    Can the text be selected in an unstyled submit button? Nope. Same thing with a styled submit button unfortunately. And I wouldn't use a submit button for navigation; use regular links for that, which will always be indexed by search engines.

  7. #7
    PHP Otaku Gibb's Avatar
    Join Date
    Jul 2004
    Location
    Texas
    Posts
    454
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    ok thanks for the help, that makes sense.

    The reason i was stylizing my buttons in the first place was to make them identical to my CSS menu links. I just noticed that you cant highlight the text in the submit versions when you could on the link versions. I never stopped to think that google doesnt need to follow form submissions


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
  •