/    Sign up×
Community /Pin to ProfileBookmark

Fancy Pop Up Windows

I need to display items in a very nice looking pop-up window. I’m not very familiar with Java Script or Ajax so is there a free program or a script someone can point me to that will display a nice looking window to show a product image and description?

to post a comment
JavaScript

9 Comments(s)

Copy linkTweet thisAlerts:
@donatelloJan 09.2011 — Alternatively, you can browse the canned scripts at sites like:

http://www.dhtmlgoodies.com

http://www.dynamicdrive.com

http://www.hotscripts.com

loads of free scripts with demos...

you can also search for them with:

http://www.JavaScriptSearch.org
Copy linkTweet thisAlerts:
@NtrimgsauthorJan 10.2011 — Greybox[/QUOTE]

That Greybox looks exactly like what I wanted, unfortunately it isn't working. Any idea why I'm getting this error: 'GB_ROOT_DIR' is undefined

[code=html]
<script type="text/javascript" src="../Greybox/AJS.js"></script>
<script type="text/javascript" src="../Greybox/AJS_fx.js"></script>
<script type="text/javascript" src="../Greybox/gb_scripts.js"></script>
<script type="text/javascript">
var GB_ROOT_DIR = "http://mysite.com/Greybox";
</script>
[/code]


This is exactly what the directions said to do - I think.

The directory I'm using it in is called "Admin" so the Greybox folder is one back.
Copy linkTweet thisAlerts:
@janusmccarthyJan 10.2011 — maybe a race condition, try moving the directory declaration to either where the documentation says, or above the scripts like so:

[CODE]
<script type="text/javascript">
var GB_ROOT_DIR = "http://mysite.com/Greybox";
</script>
<script type="text/javascript" src="../Greybox/AJS.js"></script>
<script type="text/javascript" src="../Greybox/AJS_fx.js"></script>
<script type="text/javascript" src="../Greybox/gb_scripts.js"></script>
[/CODE]


and you might want to get rid of the var too, in case its a scoping issue
Copy linkTweet thisAlerts:
@NtrimgsauthorJan 10.2011 — maybe a race condition, try moving the directory declaration to either where the documentation says, or above the scripts like so:

[CODE]
<script type="text/javascript">
var GB_ROOT_DIR = "http://mysite.com/Greybox";
</script>
</head>
<script type="text/javascript" src="../Greybox/AJS.js"></script>
<script type="text/javascript" src="../Greybox/AJS_fx.js"></script>
<script type="text/javascript" src="../Greybox/gb_scripts.js"></script>
[/CODE]


and you might want to get rid of the var too, in case its a scoping issue[/QUOTE]


I tried out what you said (except for getting rid of the var) and the window pops up now but the url doesn't go where it's supposed to go. Here's the exact code I'm using now:

[code=html]
<link href="greybox/gb_styles.css" rel="stylesheet" type="text/css" />
<script type="text/javascript">
var GB_ROOT_DIR = "http://www.rkcustoms.com/Admin/greybox/";
</script>
</head>
<script type="text/javascript" src="greybox/AJS.js"></script>
<script type="text/javascript" src="greybox/AJS_fx.js"></script>
<script type="text/javascript" src="greybox/gb_scripts.js"></script>
[/code]


And then here is where it is called:

[code=html]
<a href="http://www.rkcustoms.com/Admin/recover_password.php" title="Recover Password" rel="gb_page_center[500, 400]">Recover Password/Username</a>
[/code]
Copy linkTweet thisAlerts:
@janusmccarthyJan 10.2011 — It looks fine, what happens when you click the link?
Copy linkTweet thisAlerts:
@NtrimgsauthorJan 10.2011 — It goes to a "Page Not Found" for GoDaddy - that's where the site is hosted on. The url of this page is at: http://www.rkcustoms.com/Admin/

I'm trying to make the "Recover Username/Password" link just open up in that nice window but instead it goes to GoDaddy's page not found.
Copy linkTweet thisAlerts:
@janusmccarthyJan 10.2011 — Okay, I'm not entirely familiar with greybox, but some I saw:

  • 1. Scripts then links to css (I don't suspect this will be a problem, but in general it'll make your page faster if you put js definitions as close as possible to the top of your html document, and css definitions as close as possible to the bottom of your html document. Take a gander at yahoo developer network if you want to know more, there's a good explanation there that's really a must for any web developers.


  • 2. Make sure that your GB_ROOT_DIR has the trailing slash www.yoursite.com/greybox/ instead of www.yoursite.com/greybox


  • 3. Make sure that the folder is accessible permission wise, when I went to your GB_ROOT_DIR it gave me a 403 forbidden
  • Copy linkTweet thisAlerts:
    @donatelloJan 10.2011 — Not sure what you're using for a CMS but if you have issues like this, try using absolute URLS...

    Instead of:

    "../Greybox/AJS.js"

    Try:

    "http://www.YourURL.com/Greybox/AJS.js"

    I have had this issue all the time with Wordpress when I set my permalinks to my optimal SEO setting.
    ×

    Success!

    Help @Ntrimgs spread the word by sharing this article on Twitter...

    Tweet This
    Sign in
    Forgot password?
    Sign in with TwitchSign in with GithubCreate Account
    about: ({
    version: 0.1.9 BETA 5.23,
    whats_new: community page,
    up_next: more Davinci•003 tasks,
    coming_soon: events calendar,
    social: @webDeveloperHQ
    });

    legal: ({
    terms: of use,
    privacy: policy
    });
    changelog: (
    version: 0.1.9,
    notes: added community page

    version: 0.1.8,
    notes: added Davinci•003

    version: 0.1.7,
    notes: upvote answers to bounties

    version: 0.1.6,
    notes: article editor refresh
    )...
    recent_tips: (
    tipper: @AriseFacilitySolutions09,
    tipped: article
    amount: 1000 SATS,

    tipper: @Yussuf4331,
    tipped: article
    amount: 1000 SATS,

    tipper: @darkwebsites540,
    tipped: article
    amount: 10 SATS,
    )...